本例学从b站视频BV15741177Eh(本文仅作学习笔记,侵权必删)
源码地址
https://gitee.com/taff/supermall
不包括mode_modules文件和完整网络请求地址
项目创建过程:
1.Node
-8.9版本以上
2.webpack
-npm install webpack@3.6.0 -g
3.cli(淘宝源)
-npm install -g cnpm --registry=https://registry.npm.taobao.org
-cnpm install -g @vue/cli
4.cli3方式初始化项目
vue create supermall
src下划分目录结构
文件夹 | 作用 |
---|---|
assets | 放css文件和img文件 |
components | 放公共组件 |
views | 里面放本项目的各个视图 |
router | 路由 |
store | vuex |
network | 网络请求 |
common | 公共js文件 |
为src下的文件夹配置别名
vue.config.js文件中配置别名,不包括router文件,毕竟其只在main中导入一次
-在dom元素中使用别名时,引用路径要加~
插件安装
vue-router
axios
better-scroll
vuex
vue-lazyload
展示
1.首页:商品推荐,tab-control吸顶效果,返回顶部
2.离开首页对home状态和位置的保存
3.详情页
4.添加至购物车
本例仅完成首页、详情页及购物车
转载:https://blog.csdn.net/weixin_44938667/article/details/106878397
查看评论