升级webpack4

发表于

首先升级webpack，再全局安装webpack-cli。在webpack.config.dev.js和webpack.config.prod.js中分别添加

1
2
mode: 'development'
mode: 'production'
  1. Plugin could not be registered at ‘html-webpack-plugin-before-html-processing’. Hook was not found.

升级html-webpack-plugin

1
"html-webpack-plugin": "^4.0.0-beta.2",

在webpack.config.dev.js中，调整plugin顺序

1
2
3
4
5
6
new HtmlWebpackPlugin({
    inject: true,
    template: paths.appHtml,
    chunkSortMode: 'none'
}), 
new InterpolateHtmlPlugin(HtmlWebpackPlugin, env.raw),
  1. Cannot read property ‘context’ of undefined

升级url-loader file-loader

1
2
"file-loader": "^1.1.11", 
"url-loader": "0.6.2",
  1. missingDeps.some is not a function

升级react-dev-utils

1
"react-dev-utils": "6.1.1",
  1. this.htmlWebpackPlugin.getHooks is not a function

同1.

在webpack.config.dev.js中

1
new InterpolateHtmlPlugin(HtmlWebpackPlugin, env.raw)

然后升级html-webpack-plugin

1
npm install html-webpack-plugin@next --save-dev

  1. 移除webpack的UglifyJsPlugin

  2. Tapable.plugin is deprecated. Use new API on .hooks instead

1
npm install --save-dev extract-text-webpack-plugin

更详细的，之后再学习。