常用合集
hot-reload：热加载。不需要刷新浏览器自动看到变化。
查看htmlwebpackplugin配置
main.js
- 全局引用style，import
好处
- 图片直接打包进js，没有请求？具体再研究
发布打包网站
npm run build
打包后的文件详解
app.xxxxx(hash).js 自己写的 hash是自己根据内容计算。
查看文件大小，如果过大可以使用vue-cli中的 report可以可视化查看。
在package.json中， "report": "vue-cli-service build --report"，然后npm run report，生成的dist中的report.html。
- 例子
在我学习慕课网的饿了么app时，使用了moment组件，占用了很大的体积，是因为它会动态引用各国语言js。这里借用webpack的ContextReplacementPlugin。
步骤：
- 使用Vue-CLI 的 chainWebpack的plugin进行修改
- require webpack以后
config.plugin('context')
.use(webpack.ContextReplacementPlugin,
[/moment[/\\]locale$/, /zh-cn/])
查阅是否成功
vue inspect >>xxx.js在dist文件夹下生成了build之后的文件，可以在该文件夹中启动http-server（需要先安装npm install http-server -g）
发布方式
- 本地push
- 服务器pull
- 服务器build
确保资源路径正确
- baseURL保证base路径+相对路径
- 查看Network中静态资源路径、接口
