您现在的位置是: 网站首页 >Django >Vue+Django REST framework前后端分离生鲜电商 Django

【Vue+DRF生鲜电商】04.Vue项目结构介绍

admin2019年4月21日 11:50 Django | Python | Vue 301人已围观

Vue+Django REST framework前后端分离生鲜电商简介 Vue+Django REST framework 打造前后端分离的生鲜电商项目(慕课网视频)。 Github地址:https://github.com/xyliurui/DjangoOnlineFreshSupermarket ; Django版本:2.2、djangorestframework:3.9.2。 前端Vue模板可以直接联系我拿。

## vue开发几个概念 1. webpack:把所有东西变为js文件 2. vue、vuex、vue-router、axios 3. es6、babel ## vue源码结构 ![BLOG_20190421_115107_37](/media/blog/images/2019/04/BLOG_20190421_115107_37.png "博客图集BLOG_20190421_115107_37.png") **src/api** 所有组件的api都是在这里面配置的 **src/axios** http request 拦截器,比如404、500错误拦截 **src/components** 基础的组件 **src/router** vue-router配置 **src/static** 全局的静态文件 **src/store** vuex放的内容 **src/style** 样式文件 **src/views** 所有的组件 ## vue谷歌调试插件 每个页面组成部门:插件 1. 第一步:找到vue-devtools的github项目,并将其clone到本地. [vue-devtools](https://github.com/vuejs/vue-devtools) ``` git clone https://github.com/vuejs/vue-devtools.git ``` 或者下载 vue-devtools-dev.zip 解压 2. 第二步:安装项目所需要的npm包 ```bat > cd C:\Users\LR\Desktop\vue-devtools-dev > npm install //如果太慢的话,可以安装一个cnpm, 然后命令换成 cnpm install ``` 3. 第三步:编译项目文件 ```bat > npm run build ``` 4. 第四步:添加至chrome游览器 ``` 游览器输入地址“chrome://extensions/”进入扩展程序页面,点击“加载已解压的扩展程序...”按钮,选择vue-devtools>shells下的chrome文件夹。 /** *如果看不见“加载已解压的扩展程序...”按钮,则需要勾选“开发者模式”。 */ ``` ![BLOG_20190421_115046_36](/media/blog/images/2019/04/BLOG_20190421_115046_36.png "博客图集BLOG_20190421_115046_36.png") 关闭浏览器,重新打开,浏览器和url,按F12进入开发者工具 ![BLOG_20190421_115040_44](/media/blog/images/2019/04/BLOG_20190421_115040_44.png "博客图集BLOG_20190421_115040_44.png")

很赞哦! (2)

文章交流

  • emoji
0人参与,0条评论

当前用户

未登录,点击   登录

站点信息

  • 建站时间:网站已运行590天
  • 系统信息:Linux
  • 后台程序:Python: 3.6.6
  • 网站框架:Django: 2.2.9
  • 文章统计:222 篇
  • 文章评论:40 条
  • 腾讯分析网站概况-腾讯分析
  • 百度统计网站概况-百度统计
  • 微信公众号:扫描二维码,关注我们
返回
顶部
标题 换行 登录
网站