vue-cli：vue的脚手架工具
npm install -g vue-cli
vue init webpack sell (vue build选简化版，vuejs的大小可以减小6kb，依赖.vue文件开发)
cd sell
npm install
npm run dev

vue项目打包后路径出错

vue项目使用static目录存放图片解决方案
配置assets->common, 在webpack.base.conf.js中配置别名

如有需要

npm install less less-loader --save-dev
》》》》》》》》
npm install babel-polyfill --save-dev
main.js中import ‘babel-polyfill’，并且要写在首行（即其他import之前）

mock数据：
1.打开build/dev-server.js（webpack打包的一个入口文件，用express起一个node-server，so我们可以利用express的router来编写接口请求） ，首先定义数据的读取，然后去编写路由，然后npm run dev
可以安装google的jsonview插件，json会格式化，好看一些

在static文件夹下创建css文件夹，包含reset.css
在index.html中引入reset.css，加上meta标签

配置stylus，打开package.json，devDependencies写入"stylus-loader" : “^2.2.1”，npm install

创建index.styl，引入其他styl ，然后在main.js中全局引入stylus（webpack的特性，可以在js中引入样式），如果不想写全路径（./common），想要像components那样，需要修改webpack.base.conf.js

mixin.styl

base.styl

安装vue-resource
main.js中引入

header.vue

header.vue


图标字体，使用line-height，垂直居中

图片模糊效果

sticky footer
用min-height

star组件


@import






vue-loader在编译vue文件时，会应用一个postcss工具，给css自动添加兼容性代码

只对ios有用，使底层图片模糊

goods.vue，获取数据

商品页：better-scroll插件
npm install后，在goods.vue中引入(import BScroll from ‘better-scroll’)
获取dom↓
[外链图片转存失败,源站可能有防盗链机制,建议将图片保存下来直接上传(img-qpZmyGJO-1590512570200)(https://img-blog.csdn.net/20180117163548779?watermark/2/text/aHR0cDovL2Jsb2cuY3Nkbi5uZXQvcXFfMzU3NDYzNDQ=/font/5a6L5L2T/fontsize/400/fill/I0JBQkFCMA==/dissolve/70/gravity/SouthEast)]
虽然数据改变，dom也会跟着数据做映射，但vue在更新dom时是异步的，获取数据后，dom还没有变化就执行了_initScroll方法，此时高度的计算是有问题的，要用vue提供的nextTick方法
[外链图片转存失败,源站可能有防盗链机制,建议将图片保存下来直接上传(img-KgfqmeOT-1590512570201)(https://img-blog.csdn.net/20180117165407471?watermark/2/text/aHR0cDovL2Jsb2cuY3Nkbi5uZXQvcXFfMzU3NDYzNDQ=/font/5a6L5L2T/fontsize/400/fill/I0JBQkFCMA==/dissolve/70/gravity/SouthEast)]

实现左右两栏互动
与js挂钩的class都要加上hook作标记