草庐IT

Django+Vue环境搭建

lay.zh 2023-05-14 原文

一、Django环境

1、下载Django

pip install django

2、创建Django项目

django-admin startproject server  #server  为项目名

3、将最外层目录改为项目名称

4、启动服务

python manage.py runserver 0.0.0.0:8000

二、Vue环境

因为Vue环境可能会面临网络问题引发的timeout，所以以下介绍两种方式来安装。

方式一：线上安装

1、安装node.js  js环境

2、使用npm淘宝镜像，避免npm下载速度过慢的问题

npm install -g cnpm --registry=https://registry.npm.taobao.org

3、使用cnpm 下载vue-cli

cnpm install -g @cue/cli

4、创建项目

vue init webpack client  # client为项目名称

5、安装依赖

cd client

cnpm install

6、运行调式的服务

cnpm run dev

7、vue项目写完后，打包vue项目，将项目打包为dist文件夹

cnpm run build

方式二：本地安装

1、github下载vue压缩包，并将解压后的安装包放在项目同级

2、用相对路径进行初始化，初始化配置可自定义，见下图：

vue init ./webpack-develop client  # client是项目名称

3、之后依次安装依赖、运行调式的服务、打包等

三、Django+Vue环境搭建

1、配置 Django 模板的搜索路径

Django框架本身支持模板编辑，但是与Vue集成之后，需要修改为Vue路径才可生效

修改Django中setting文件“DIRS”路径：

2、配置 Django 静态文件搜索路径

TEMPLATES= [

{

        'BACKEND': 'django.template.backends.django.DjangoTemplates',

        'DIRS': ["client/dist"], # 配置vue路径

        'APP_DIRS': True,

        'OPTIONS': {

            'context_processors': [

                'django.template.context_processors.debug',

                'django.template.context_processors.request',

                'django.contrib.auth.context_processors.auth',

                'django.contrib.messages.context_processors.messages',

],

},

},

]

STATICFILES_DIRS= [os.path.join(BASE_DIR, "client/dist/static")]  # 添加静态文件路径

3、修改django的主目录的urls文件

Vue中的html文件和static同级目录。

from django.conf.urlsimport url

from django.contribimport admin

from django.views.generic.baseimport TemplateView

urlpatterns= [

    url(r'^admin/', admin.site.urls),

    url(r'', TemplateView.as_view(template_name="index.html")),

]

4、启动django服务，访问localhost:8000 则可以出现vue的首页

python manage.py runserver

DjangoVueblockquoteimgvue.jspython

有关Django+Vue环境搭建的更多相关文章

  1. ruby-on-rails - 在 Rails 开发环境中为 .ogv 文件设置 Mime 类型 - 2

    我正在玩HTML5视频并且在ERB中有以下片段:mp4视频从在我的开发环境中运行的服务器很好地流式传输到chrome。然而firefox显示带有海报图像的视频播放器，但带有一个大X。问题似乎是mongrel不确定ogv扩展的mime类型，并且只返回text/plain，如curl所示:$curl-Ihttp://0.0.0.0:3000/pr6.ogvHTTP/1.1200OKConnection:closeDate:Mon,19Apr201012:33:50GMTLast-Modified:Sun,18Apr201012:46:07GMTContent-Type:text/plain

  2. Vscode+Cmake配置并运行opencv环境(Windows和Ubuntu大同小异) - 2

    之前在培训新生的时候，windows环境下配置opencv环境一直教的都是网上主流的vsstudio配置属性表，但是这个似乎对新生来说难度略高(虽然个人觉得完全是他们自己的问题)，加之暑假之后对cmake实在是爱不释手，且这样配置确实十分简单(其实都不需要配置)，故斗胆妄言vscode下配置CV之法。其实极为简单，图比较多所以很长。如果你看此文还配不好，你应该思考一下是不是自己的问题。闲话少说，直接开始。0.CMkae简介有的人到大二了都不知道cmake是什么，我不说是谁。CMake是一个开源免费并且跨平台的构建工具，可以用简单的语句来描述所有平台的编译过程。它能够根据当前所在平台输出对应的m

  3. 计算机毕业设计ssm+vue基本微信小程序的小学生兴趣延时班预约小程序 - 2

    项目介绍随着我国经济迅速发展,人们对手机的需求越来越大,各种手机软件也都在被广泛应用,但是对于手机进行数据信息管理,对于手机的各种软件也是备受用户的喜爱小学生兴趣延时班预约小程序的设计与开发被用户普遍使用,为方便用户能够可以随时进行小学生兴趣延时班预约小程序的设计与开发的数据信息管理,特开发了小程序的设计与开发的管理系统。小学生兴趣延时班预约小程序的设计与开发的开发利用现有的成熟技术参考,以源代码为模板,分析功能调整与小学生兴趣延时班预约小程序的设计与开发的实际需求相结合,讨论了小学生兴趣延时班预约小程序的设计与开发的使用。开发环境开发说明：前端使用微信微信小程序开发工具：后端使用ssm：VU

  4. ruby-on-rails - ruby gem如何在rails环境下工作 - 2

    我试图在rails中了解rubygems是如何变得可以自动使用的，而不是在使用required的文件中gem？ 最佳答案 这是通过bundler/setup完成的:http://bundler.io/v1.3/bundler_setup.html.它在您的config/boot.rb文件中是必需的。简而言之，它首先将环境变量设置为指向您的Gemfile:ENV['BUNDLE_GEMFILE']||=File.expand_path('../../Gemfile',__FILE__)然后它通过要求bundler/setup将所有ge

  5. ruby-on-rails - 我需要一个真正的 UNIX RoR 开发环境 - 2

    从一开始，我就是一个Windows高手。我从MS-DOS开始。我安装了Windows2.1以及此后的所有Windows。现在，我家里有10台不同的Windows机器在运行，从Windows7Ultimate到各种版本的WindowsServer。我还没有完成Windows8，也不想去那里。我在服务器和各种软件方面都有UNIX经验，但它并不是我的首选环境。但是，我想我正在转换。我试图假装使用Cygwin和MSYS在Windows下运行UNIX。我的目的是搭建一个开发环境。两者都让我失望了。我花了比开发更多的时间来解决一系列技术问题。这是NotAcceptable。到目前为止，我的Ruby

  6. ruby-on-rails - 如果特定语言环境中缺少翻译，如何配置 i18n 以使用 en 语言环境？ - 2

    如果特定语言环境中缺少翻译，如何配置i18n以使用en语言环境翻译？当前已插入翻译缺失消息。我正在使用RoR3.1。 最佳答案 找到相似的question这里是答案:#application.rb#railswillfallbacktoconfig.i18n.default_localetranslationconfig.i18n.fallbacks=true#railswillfallbacktoen,nomatterwhatissetasconfig.i18n.default_localeconfig.i18n.fallback

  7. ruby-on-rails - 可移植 Ruby on Rails 环境 - 2

    我给自己买了一个新的8gigUSBkey，我正在寻找一个合适的解决方案来拥有一个可移植RoR环境来学习。我在谷歌上搜索了一下，发现了一些可能性，但我很想听听一些现实生活中的经历和意见。谢谢! 最佳答案 我喜欢InstantRails，非常容易使用，无需安装程序，也不会修改您的系统环境。 关于ruby-on-rails-可移植RubyonRails环境，我们在StackOverflow上找到一个类似的问题： https://stackoverflow.com/q

  8. ruby-on-rails - 如何通过 URL 更改语言环境？ - 2

    在我的双语Rails4应用程序中，我有一个像这样的LocalesController:classLocalesController用户可以通过此表单更改其语言环境:deflocale_switcherform_tagurl_for(:controller=>'locales',:action=>'change_locale'),:method=>'get',:id=>'locale_switcher'doselect_tag'set_locale',options_for_select(LANGUAGES,I18n.locale.to_s)end这有效。但是，目前用户无法通过URL更改

  9. ruby - 从 FaSTLane 将环境变量传递给 shell 脚本 - 2

    我在跑Fastlane(适用于iOS的持续构建工具)以执行用于解密文件的自定义shell脚本。这是命令。sh"./decrypt.shENV['ENCRYPTION_P12']"我想不出将环境变量传递给该脚本的方法。显然，如果我将密码硬编码到脚本中，它就可以正常工作。sh"./decrypt.shmypwd"有什么建议吗？ 最佳答案 从直接Shell中扩展假设这里的sh是一个faSTLane命令，它以给定的参数作为脚本文本调用shell命令:#asafastlanedirectivesh'./decrypt.sh"$ENCRYPTI

  10. 【自动驾驶环境感知项目】——基于Paddle3D的点云障碍物检测 - 2

    文章目录1.自动驾驶实战：基于Paddle3D的点云障碍物检测1.1环境信息1.2准备点云数据1.3安装Paddle3D1.4模型训练1.5模型评估1.6模型导出1.7模型部署效果附录show_lidar_pred_on_image.py1.自动驾驶实战：基于Paddle3D的点云障碍物检测项目地址——自动驾驶实战：基于Paddle3D的点云障碍物检测课程地址——自动驾驶感知系统揭秘1.1环境信息硬件信息CPU:2核AI加速卡:v100总显存:16GB总内存:16GB总硬盘:100GB环境配置Python:3.7.4框架信息框架版本:PaddlePaddle2.4.0（项目默认框架版本为2.3

随机推荐