webpack4的升级教程网上实在有很多，我也是跟着教程进行升级，但是我发现在我使用了creact-react-app脚手架构建的项目中进行升级，会有一些其它bug存在，这里做一个排查和解决的记录。
开发环境配置
-
将webpack升级到webpackV4
-
把项目run起来
-
此时会遇到第一个错误
Plugin could not be registered at 'html-webpack-plugin-before-html-processing'. Hook was not found.
BREAKING CHANGE:
There need to exist a hook at 'this.hooks'. To create a compatiblity layer for this hook, hook into 'this._pluginCompat'.
需要做的事情是 升级相关依赖包
webpack-cli
webpack-dev-server
html-webpack-plugin
react-dev-utils
file-loader
url-loader
-
过程中会遇到很多奇怪的报错
Module build failed: TypeError: Cannot read property 'context' of undefined
类似这种错误，就是你要升级你的相关loader包了
DeprecationWarning: Tapable.plugin is deprecated. Use new API on `.hooks` instead
at ModuleScopePlugin.apply
更新 react-dev-utils 和 extract-text-webpack-plugin
this.htmlWebpackPlugin.getHooks is not a function
将HtmlWebpackPlugin放置于InterpolateHtmlPlugin之前，并且传递给InterpolateHtmlPlugin，然后设置PUBLIC_URL
new HtmlWebpackPlugin({
inject: true,
template: paths.appHtml,
}),
new InterpolateHtmlPlugin(HtmlWebpackPlugin, {
PUBLIC_URL: publicUrl,
}),
Object proxy configuration is superseded by src/setupProxy.js To check
if action is required, look for the proxy key in package.json and
follow this table:
更新版本后的packjson不支持Proxy为对象的写法，改为字符串形式
missingDeps.some not a function
react-dev-utils要升级到6及以上的版本
this.htmlWebpackPlugin.getHooks is not a function
升级 html-webpack-plugin 4.0.0.alpha-2
