webpack-性能优化
构建速度
优化babel-loader
采取缓存
IgnorePlugin（避免打包无用代码）
ignorePlugin无法自动识别哪些真的只有到了
需要用户收到排除 然后手动引入
还是需要一些经验使用的
noParse（避免重复打包）
已打包过的代码无需重新打包
happyPack（多进程打包）
ParallelUglifyPlugin（多进程压缩js）
- webpack内置uglify压缩js
- 开启多进程压缩js 跟happypack同理
自动刷新【不可用于生产】
注意 开启webpack-dev-server 会自动开启热更新
并且网页全部刷新 会丢失内存和状态
热更新【不可用于生产】
新代码生效 网页不刷新 内存不丢失
需要自己配置 如何热更新
DllPlugin（动态链接库插件）【不可用于生产】
- 前端框架如 vue React 体积大 构建慢
- 较稳定，不常升级版本
- 同版本仅构件一次
- webpack内置
包含两个文件
- DllPlugin：打包出dll文件
- DllReferencePlugin:使用dll文件
生成Dll
然后再开发环境中引入dll文件
配置地址
并且还要忽略掉nodem中代码（好麻烦好费力）
产出代码
小图片base64编码
bundle加哈希
懒加载
比较大的文件 直接异步加载进来（代码、组件、路由）
- 提取公共代码
IngorePlugin
只引用用的部分
使用CDN加速
会修改所有的url前缀
后面打包出来的文件会变成如下前缀
使用production（mode：XXXX）
- 自动开启代码压缩
- Vue React 会自动删掉调试代码（如开发环境的warning）
- 启动 Tree-Shaking （必须用ES6 Module 才生效）
仅仅把用到的 打包 没有使用的无用变量会自动筛选掉
ScopeHostiong
避免多个文件打包后 多个函数生成多个作用域
可以将多个函数合并为一个函数
