diff --git a/src/content/migrate/4.md b/src/content/migrate/4.md index 6a457df63e18..602b532fcd37 100644 --- a/src/content/migrate/4.md +++ b/src/content/migrate/4.md @@ -11,23 +11,30 @@ This guide only shows major changes that affect end users. For more details plea ## Node.js v4 -If you are still using Node.js v4 or lower, you need to upgrade your Node.js installation to Node.js v6 or higher. +*TLDR:; Node.js versions lower than 6 are no longer supported. So, upgrade to the latest Node.js LTS verison.* +If you are still using Node.js v4 or lower, you need to upgrade your Node.js installation to Node.js v6 or higher. Ideally you should be getting the latest Long Term Support(LTS) version of Node.js. Instructions for upgrading your Node.js version can be found [here](https://stackoverflow.com/questions/10075990/upgrading-node-js-to-latest-version). This is because the source of webpack was changed to a higher ECMAScript version in webpack 4. ## CLI The CLI has moved to a separate package: webpack-cli. You need to install it before using webpack, see [basic setup](/guides/getting-started/#basic-setup). +The installation guide can be found [here](/src/content/guides/installation.md). + ## Update plugins -Many 3rd-party plugins need to be upgraded to their latest version to be compatible. +Many 3rd party plugins need to be updated to the latest versions to be compatible with webpack 4. Many of the popular plugins and the links to their repositories can be found [here](https://github.com/webpack-contrib/awesome-webpack#webpack-plugins). + +A more informative resource can be found [here](https://medium.com/webpack/webpack-4-migration-guide-for-plugins-loaders-20a79b927202). ## mode Add the new [`mode`](/concepts/mode/) option to your config. Set it to production or development in your configuration depending on config type. +More information on the different types of `mode`'s like `none`, `development`, and `production` are mentioned in [here](https://webpack.js.org/concepts/mode/#usage). + __webpack.config.js__ ``` diff @@ -37,7 +44,9 @@ module.exports = { } ``` -Alternatively you can pass it via CLI: `--mode production`/`--mode development` +Alternatively you can pass it via CLI: `--mode production`/ `--mode development` + +T> Since the goals of the `development` and `production` versions are different. You could use `webpack-merge` to use the best of both modes. Read more [here](https://github.com/webpack/webpack.js.org/blob/master/src/content/guides/production.md) ## Deprecated/Removed plugins @@ -91,6 +100,8 @@ The `CommonsChunkPlugin` was removed. Instead the [`optimization.splitChunks`](/ See documentation of the [`optimization.splitChunks`](/configuration/optimization/#optimization-splitchunks) for more details. The default configuration may already suit your needs. +More information on this change is mentioned in [here](https://gist.github.com/sokra/1522d586b8e5c0f5072d7565c2bee693). + T> When generating the HTML from the stats you can use `optimization.splitChunks.chunks: "all"` which is the optimal configuration in most cases. ## import() and CommonJS