实际开发当中我们的一些包会导致 打包体积过大 比如引入jQuery 等等
解决方案
1 cdn 引入 在模板当中使用 link 引入 (不建议这样)
2.同时link cdn 引入 借助webpack externals externals: {jquery: 'jQuery' }
(推荐)
好处 单独使用 link 之后 还可以使用 import 引入 自定义 属性
3/利用 webpack.ProvidePlugin 可以全局使用
new webpack.ProvidePlugin({
$: 'jquery',
$$: 'jquery'
"全局使用的名字 ": '下载的包名,或者是link 引入的'
这样的配置可以让我们在项目中 不用再写 import xx from 'xx' 直接使用对应的变量即可
})
- 自动查找后缀
resolve: {
// 利用这个 引入 内容 可以不添加 后缀 在这里配置就可以
extensions: ['.vue', '.js']
}
- 多进程打包 thread-loader 提升构建速度 @vue/cli create-react-app 都已经内置了
- splitChunks 分包
- DllPlugin DllReferencePlugin 分包 加快 构建速度