django安装配置方式略过

1、安装node.js,官网地址:https://nodejs.org/zh-cn/download/

2、cd到项目目录下,执行npm install -g vue-cli

3、在项目目录下新建前端工程目录 vue-init webpack vuefront

4、进入前端工程目录,安装: npm install

5、在前端工程目录下执行,看是否安装成功:npm run dev

浏览器访问127.0.0.1:8080/index 出现vue介绍页面就成功了
6、在前端工程目录下,输入npm run build,如果项目没有错误的话,就能够看到所有的组件、css、图片等都被webpack自动打包到dist目录下了

7、在urls里配置路由

from django.views.generic.base import TemplateView
。。。
path(r'^$', TemplateView.as_view(template_name="index.html"))
8、进入settings.py,修改模板系统,
TEMPLATES,
'DIRS': ['vuefront/dist'],
设置静态文件目录
STATICFILES_DIRS = [
os.path.join(BASE_DIR, "vuefront/dist/static"),
]
可以参考文章
https://blog.csdn.net/Jack_wise/article/details/80690826

django+vue的更多相关文章

  1. 解决Django+Vue前后端分离的跨域问题及关闭csrf验证

      前后端分离难免要接触到跨域问题,跨域的相关知识请参:跨域问题,解决之道   在Django和Vue前后端分离的时候也会遇到跨域的问题,因为刚刚接触Django还不太了解,今天花了好长的时间,查阅了 ...

  2. nginx + uwsgi 部署 Django+Vue项目

    nginx + uwsgi 部署 Django+Vue项目 windows 本地 DNS 解析 文件路径 C:\Windows\System32\drivers\etc 单机本地测试运行方式,调用dj ...

  3. Django+vue在腾讯云上搭建前后端分离项目

    最近打算用Django+vue搭建一个个人主站,在此记录一下搭建项目的整个过程. 一 开发环境: 腾讯云Centos     7 Python                3.7 Django    ...

  4. Nginx+uwsgi+django+vue部署项目

    购买服务器 # 购买阿里云服务器 # 短期或是测试使用,创建 按量收费 服务器,可以随时删除,删除后不再计费,但要保证账户余额100元以上 连接服务器 1)账号 >: ssh root@39.9 ...

  5. Django+Vue+Nginx+Https域名代理访问

    Django+Vue使用Nginx实现Https域名的安全访问 前端 VUE 前端访问自身域名: https://demo.com,后序使用 Nginx 代理至后端 直接访问后端https:api会无 ...

  6. 海纳百川无所不容,Win10环境下使用Docker容器式部署前后端分离项目Django+Vue.js

    原文转载自「刘悦的技术博客」https://v3u.cn/a_id_179 随着现代化产品研发的不断推进,我们会发现,几乎每个产品线都会包含功能各异的服务,而且服务与服务之间存在也会存在着错综复杂的依 ...

  7. Django+Vue打造购物网站(十)

    首页.商品数量.缓存和限速功能开发 将环境切换为本地,vue也切换为本地 轮播图 goods/serializers.py class BannerSerializer(serializers.Mod ...

  8. Django+Vue打造购物网站(九)

    支付宝沙箱环境配置 https://openhome.alipay.com/platform/appDaily.htm?tab=info 使用支付宝账号进行登陆 RSA私钥及公钥生成 https:// ...

  9. Django+Vue打造购物网站(五)

    注册和登陆 drf的认证 http://www.django-rest-framework.org/api-guide/authentication/ settings.py文件的配置 INSTALL ...

随机推荐

  1. [Alpha阶段]第十次Scrum Meeting

    Scrum Meeting博客目录 [Alpha阶段]第十次Scrum Meeting 基本信息 名称 时间 地点 时长 第十次Scrum Meeting 19/04/15 大运村寝室6楼 35min ...

  2. $_SERVER['HTTP_REFERER']的使用

    转载:http://www.5idev.com/p-php_server_http_referer.shtml 使用 $_SERVER['HTTP_REFERER'] 将很容易得到链接到当前页面的前一 ...

  3. 电脑突然使用不了复制粘贴快捷键,Ctrl+C和Ctrl+V没用

    今天不知道怎么回事,在复制代码的时候突然用不了Ctrl+C和Ctrl+V了 刚开始我还以为是eclipse出问题,然后我在idea中是可以复制 和 粘贴的,然后我又打开文本编辑器notepad++,发 ...

  4. vue.js实战——props单向数据流

    Vue2.x通过props传递数据是单向的了,也就是父组件数据变化时会传递给子组件,但是反过来不行. 业务中会经常遇到两种需要改变prop的情况, 一种是父组件传递初始值进来,子组件将它作为初始值保存 ...

  5. 2018 API变化

  6. 关于PWA ( Progressive web apps )

    渐进式Web应用程序使用现代Web API以及传统的渐进式增强策略来创建跨平台Web应用程序.这些应用程序无处不在,并提供多种功能,使其具有与本机应用程序相同的用户体验优势.这套文档告诉您需要了解的所 ...

  7. openflow packet_out和packet_in分析

    任务目的 1. 掌握OpenFlow交换机发送Packet-in消息过程及其消息格式. 2. 掌握OpenFlow控制器发送Packet-out消息过程及其消息格式. 实验原理 Packet-In 使 ...

  8. 戏说java与web

    slmgr.vbs /ipk NPPR9-FWDCX-D2C8J-H872K-2YT43教育版换回企业版 搜百度网盘  http://www.pansoso.com/ https://m.zhangl ...

  9. Neovim中NERDTree等多处cursorline不高亮

    标题表达的不是很清楚,看下图把 解决方法 添加下面内容到init.vim " 针对NERDTree " https://github.com/scrooloose/nerdtree ...

  10. [HNOI2009]最小圈(分数规划+SPFA判负环)

    题解:求环长比环边个数的最小值,即求min{Σw[i]/|S|},其中i∈S.这题一眼二分,然后可以把边的个数进行转化,假设存在Σw[i]/|S|<=k,则Σw[i]-k|S|<=0,即Σ ...