关于webpack升级和打包

webpack1.0升级(搭配的是vue)

首先要了解webpack每个配置的作用,主要参考下面的链接:

https://www.cnblogs.com/libin-1/p/6596810.html

https://www.jianshu.com/p/0bd6d0df79fb

https://juejin.im/post/5bd9838df265da393c06033a

因为原本webpack版本太低  直接用vue-cli构建个新的架构然后把文件复制过去

遇到的问题:

vue-cli没有预安装关于scss的loader,所以要安装

"node-sass": "^4.11.0",  "sass-loader": "^6.0.7",  vue-cli已经有配置好css打包,无需再写关于css的loader

vue-router的版本低导致路由按需引入后页面空白没渲染   用回3.0.0以上的版本就可以

本地调试问题  接口代理 在config => dev => proxyTable中设置接口的代理

dev 配置assetsSubDirectory: 'addons/yun_shop/static',
如果有多用使用scoped样式, build配置里面allChunks关掉, 禁止合并到app.css 

打包的主css过大   把allChunks设置为false  把每个文件设置了scoped打包到各自的js中

new ExtractTextPlugin({
  filename: utils.assetsPath('css/[name].[contenthash].css'),
  allChunks: false,
}),
npm run build --report分析打包的文件   把echats按需加载

猜你喜欢

转载自blog.csdn.net/qq_38188485/article/details/102876406