安装
webpack4
webpack-cli 命令行单独出来,比如启动webpack
webpack-dev-server^3.1.0(依赖node6.11.5)
vue-loader^14.1.0
extract-text-webpack-plugin@next 还未发正式
其他的loader,如果在编译过程中报can not find xxx的错误,说明xxx对应的loader可能需要升级了
看一下有没有peerDependencies的提醒,有的话升级以下插件
零配置
"mode": {
"description": "Enable production optimizations or development hints.",
"enum": [
"development",
"production",
"none"
]
}
一旦开启了 --mode production，会自动开启代码压缩、scope hoist(作用域提升) 等插件，以及自动传递环境变量给 lib 包，所以已经不需要 plugins 这个配置项了。
同理，开启了 --mode development 会自动开启 sourceMap 等开发插件，我们只要关心更简单的配置，这就是 4.0 零配置的重要改变。
当然，基本的entry output module 还是需要配置的
mode 的默认值是 production
entry 的默认值是 ./src
output.path 的默认值是 ./dist
UglifyJs 插件默认开启 caches和 parallizes(使用多进程并行运行和文件缓存来提高构建速度)
更详细的可以参考webpack 4 终于知道「约定优于配置」了
如果需要给配置文件传一些参数，通过 --env 传递
webpack-dev-server --mode development --env.param xxx
webpack.config.js 接收
const param = yargs.argv.env.param
CommonsChunkPlugin
webpack 4 移除了 CommonsChunkPlugin, 取而代之的是两个新的配置项 optimization.splitChunks 和 optimization.runtimeChunk
通过设置 optimization.splitChunks.chunks: "all" 来启动默认的代码分割配置项
当满足如下条件时，webpack 会自动打包 chunks:
当前模块是公共模块（多处引用）或者模块来自 node_modules
当前模块大小大于 30kb
如果此模块是按需加载，并行请求的最大数量小于等于 5
如果此模块在初始页面加载，并行请求的最大数量小于等于 3
