-
Updated to Webpack 5 and updated all plugins and loaders - custom configuration for any of these could now be invalid.
-
Dropped use of PhantomJS - the default browser for Karma testing is now
ChromeHeadless
and Chrome must be available wherever tests are going to be run.
- Updated to Babel 7.13
- Updated to Karma 6 and Mocha 8
- css-minimizer-webpack-plugin v2.0.0
- postcss v8.2.13
- @babel/cli: v7.10.3 → v7.13.16
- @babel/core: v7.10.3 → v7.14.0
- @babel/plugin-syntax-jsx: v7.10.1 → v7.12.13
- @babel/plugin-transform-react-constant-elements: v7.10.1 → v7.13.13
- @babel/plugin-transform-react-jsx: v7.10.3 → v7.13.12
- @babel/plugin-transform-runtime: v7.10.3 → v7.13.15
- @babel/preset-env: v7.10.3 → v7.14.0
- @babel/preset-react: v7.10.1 → v7.13.13
- @babel/runtime: v7.10.3 → v7.14.0
- @pmmmwh/react-refresh-webpack-plugin: v0.3.3 → v0.4.3
- autoprefixer: v9.8.4 → v10.2.5
- babel-loader: v8.1.0 → v8.2.2
- babel-plugin-add-module-exports: v1.0.2 → v1.0.4
- babel-plugin-inferno: v6.1.1 → v6.2.0
- babel-preset-proposals: v0.3.0 → v0.4.0
- case-sensitive-paths-webpack-plugin: v2.3.0 → v2.4.0
- copy-webpack-plugin: v6.0.2 → v8.1.1
- cross-env: v7.0.2 → v7.0.3
- css-loader: v3.6.0 → v5.2.4
- debug: v4.1.1 → v4.3.1
- file-loader: v6.0.0 → v6.2.0
- fs-extra: v9.0.1 → v9.1.0
- gzip-size: v5.1.1 → v6.0.0
- html-webpack-plugin: v4.3.0 → v5.3.1
- inquirer: v7.2.0 → v8.0.0
- karma: v5.1.0 → v6.3.2
- karma-coverage: v2.0.2 → v2.0.3
- karma-sourcemap-loader: v0.3.7 → v0.3.8
- karma-webpack: v4.0.2 → v5.0.0
- mini-css-extract-plugin: v0.9.0 → v1.4.0
- mocha: v7.1.2 → v8.3.2
- open: v7.0.4 → v8.0.7
- ora: v4.0.4 → v5.4.0
- postcss-loader: v3.0.0 → v5.2.0
- react-refresh: v0.8.3 → v0.10.0
- resolve: v1.17.0 → v1.20.0
- run-series: v1.1.8 → v1.1.9
- semver: v7.3.2 → v7.3.5
- style-loader: v1.2.1 → v2.0.0
- terser-webpack-plugin: v3.0.6 → v5.1.1
- url-loader: v4.1.0 → v4.1.1
- webpack: v4.43.0 → v5.36.1
- webpack-dev-middleware: v3.7.2 → v4.1.0
- webpack-dev-server: v3.11.0 → v3.11.2
- @babel/plugin-proposal-optional-chaining (only used to avoid a Webpack 4 parser bug)
- @babel/plugin-proposal-nullish-coalescing-operator (only used to avoid a Webpack 4 parser bug)
- @babel/polyfill (no longer required for PhantomJS)
- babel-plugin-transform-decorators-legacy (obsolete, was no longer being used)
- karma-phantomjs-launcher (dropped PhantomJS)
- optimize-css-assets-webpack-plugin (replaced by css-minimizer-webpack-plugin)
- phantomjs-prebuilt (dropped PhantomJS)
- Bumped Node.js version in templates.
- Don't include
docs/
in the npm package.
- Node.js 8 is no longer supported; Node.js 10.13.0 is now the minimum required version, as per many of nwb's dependencies.
Browser Support
-
Removed default polyfills for
Promise
,fetch()
andObject.assign()
and deprecatedpolyfill
config.If you need to support older browsers, you will now need to include the necessary polyfills in your app - see the new Browser Support docs for details on polyfilling and suggested modules which provide them.
If this change affects your app, a quick fix is to use react-app-polyfill's IE11 polyfill, which is equivalent to what nwb's default polyfill used to be:
import 'react-app-polyfill/ie11'
-
For apps and quick commands,
@babel/preset-env
is now configured to only transpile the necessary ECMAScript 2015+ for supported browsers.When running a development server, this defaults to the most recent version of Chrome, Firefox or Safari, so you may need to adjust
browsers.development
config if you're using an out of date browser and you will need to adjust it if you're developing with an older browser supported by your app. -
Default browser configuration for Autoprefixer when building an app has changed from
>1%, last 4 versions, Firefox ESR, not ie < 9
to>0.2%, not dead, not op_mini all
.When running a development server, the default browser configuration has changed to
last 1 chrome version, last 1 firefox version, last 1 safari version
.
Configuration
-
Deprecated using a string for
webpack.autoprefixer
config to configure supported browsers - this will no longer do anything and should be moved to the newbrowsers
config. -
Removed support for
babel.stage
andwebpack.uglify
config deprecated in nwb v0.24.0. -
copy-webpack-plugin v6.0.0 has breaking changes to its options which you should read if you're using
webpack.copy
config.In particular, the
ignore
option in a copy pattern must now be put inside the newglobOptions
option.
Dependencies
- file-loader v6.0.0 changed its default hashing algorithm so hashes in output filenames will change after updating to this release, even if their contents haven't changed.
- Added top-level
browsers
config to configure supported browsers. This supports using separate browserslist queries for development and production. - Added Browser Support docs, with a section on polyfilling missing language features.
- autoprefixer: v9.7.6 → v9.8.0
- chalk: v3.0.0 → v4.0.0
- copy-webpack-plugin: v5.1.1 → v6.0.1
- file-loader: v4.3.0 → v6.0.0
- fs-extra: v8.1.0 → v9.0.0
- karma: v4.4.1 → v5.0.9
- karma-mocha: v1.3.0 → v2.0.1
- terser-webpack-plugin v2.3.6 → v3.0.1
- url-loader: v2.3.0→ v4.1.0
- Fixed inclusion of
__source
and__self
debugging information when transpiling JSX inreact-component
projects by defaultingprocess.env.NODE_ENV
to'production'
when building.
- open: v7.0.3 → v7.0.4
- @babel/core: v7.90 → v7.9.6
- @babel/plugin-transform-runtime: v7.9.0 → v7.9.6
- @babel/preset-env: v7.9.0 → v7.9.6
- @babel/runtime: v7.9.2 → v7.9.6
- @pmmmwh/react-refresh-webpack-plugin: v0.2.0 → v0.3.1
- autoprefixer: v9.7.5 → v9.7.6
- cross-spawn: v7.0.1 → v7.0.2
- css-loader: v3.4.2 → v3.5.3
- html-webpack-plugin: v3.2.0 → v4.3.0
- karma-coverage: v2.0.1 → v2.0.2
- mocha: v7.1.1 → v7.1.2
- ora: v4.0.3 → v4.0.4
- react-refresh: v0.8.1 → v0.8.2
- resolve: v1.15.1 → v1.17.0
- semver: v7.1.3 → v7.3.2
- style-loader: v1.1.3 → v1.2.1
- terser-webpack-plugin v2.3.5 → v2.3.6
- webpack: v4.42.1 → v4.43.0
- webpack-dev-server: v3.10.3 → v3.11.0
- html-webpack-plugin got a major version bump to v4
- Output HTML is now minified by default - you can disable this by configuring
html.minification = false
. - Chunk sorting was removed, but it seems to work as before for the ordering of the JavaScript files generated by nwb's build.
- The plugin nwb uses to inline the webpack runtime chunk was rewritten to use v4's new hooks.
- Output HTML is now minified by default - you can disable this by configuring
- The
lang
attribute on<html>
wasn't getting set to the default'en'
when using thenwb react
,nwb preact
andnwb inferno
quick development commands.
- @babel/plugin-transform-react-jsx: v7.9.1 → v7.9.4
- @babel/preset-react: v7.9.1 → v7.9.4
- @babel/runtime: v7.9.0 → v7.9.2
- autoprefixer: v9.7.4 → v9.7.5
- html-webpack-plugin: v3.2.0 → v4.0.1
- webpack: v4.42.0 → v4.42.1
-
Added
babel.react
config to configure@babel/preset-react
options, allowing you to opt-in to using the newautomatic
runtime which was added in Babel v7.9.0.For convenience, you can just configure the runtime name if you want to try it with the experimental version of React:
module.exports = { babel: { react: 'automatic' } }
- Updated to Babel v7.9.0.
- Validate that the entry module for quick commands (e.g.
nwb react run SomeComponent.js
) exists, to avoid a confusing error message [#441]
- @babel/core: v7.8.7 → v7.9.0
- @babel/plugin-transform-react-constant-elements: v7.8.3 → v7.9.0
- @babel/plugin-transform-react-jsx: v7.8.3 → v7.9.1
- @babel/plugin-transform-runtime: v7.8.3 → v7.9.0
- @babel/preset-env: v7.8.7 → v7.9.0
- @babel/preset-react: v7.8.3 → v7.9.1
- @babel/runtime: v7.8.7 → v7.9.0
- babel-loader: v8.0.6 → v8.1.0
- mocha: v7.1.0 → v7.1.1
- react-refresh: v0.8.0 → v0.8.1
- Added a temporary hack to bypass startup info logging Webpack Dev Server currently does even when its
quiet
option is set. - CSS minification hasn't been enabled since nwb v0.23.0 as css-loader v1.0.0 stopped doing it by default - re-enable it using Optimize CSS Assets Webpack Plugin [#467]
- minimist v1.2.4 → v1.2.5
- optimize-css-assets-webpack-plugin v5.0.3
- Fixed copying of co-located
.test.js
/.spec.js
files when building a React component or web module by also passing the new--no-copy-ignored
flag when calling @babel/cli [#529]
- Fixed serving the demo app for a React component [#542]
- Fixed Fast Refresh for the default React component demo app by exporting the
Demo
component in the template.
-
Node.js 6 is no longer supported; Node.js 8.9.0 is now the minimum required version, as per many of nwb's dependencies.
-
Updated to Babel 7
-
babel.runtime
config no longer accepts aString
to enable an additional, named feature.Pass an
Object
with plugin options instead. -
Support for tests in
*-test.js
files has been removed, as@babel-core
no longer supports pattern matching them to ignore them when co-located insrc/
.Rename these to
*.test.js
instead.
-
-
Dropped support for the old
--no-hmre
alias to disable Hot Module Replacement, just use--no-hmr
instead. -
Updated Preact config for Preact X.
-
Dependencies with (documented) breaking changes:
- Added
babel.proposals
config to configure use of Babel's proposal plugins. - Added an
en
property towebpack.html
config to set the document language when using nwb's default HTML template [#520] [Muhnad]
- Fix creation of an extra directory when creating a scoped component's UMD build [#513] [rrapiteanu]
- React Refresh Webpack Plugin is now used to enable Fast Refresh for React apps, as babel-plugin-react-transform is deprecated and doesn't support Babel 7.
- Replaced use of
UglifyJsPlugin
withTerserWebpackPlugin
. - React compatibility is now always configured for Preact apps, as
preact/compat
is now part of thepreact
module.
-
Deprecated
babel.stage
config, as Babel'sstage-X
presets were/are being removed in Babel 7 - if you provide it, nwb will warn you and enable Babel proposal plugins equivalent to the current stage they're at.Use
babel.proposals
config instead if you want to toggle some or all additional proposal plugins on. -
Deprecated
webpack.uglify
config, which has been renamed towebpack.terser
. -
Autoprefixer renamed its
browsers
option tooverrideBrowserslist
, so you will get deprecation warnings if you were using{browsers: ...}
inwebpack.autoprefixer
config.
- autoprefixer: v9.0.2 → v9.7.4
- babel-plugin-add-module-exports: v0.2.1 → v1.0.2
- babel-plugin-inferno: v5.0.1 → v5.1.0
- case-sensitive-paths-webpack-plugin: v2.1.2 → v2.3.0
- chalk: v2.4.1 → v3.0.0
- copy-webpack-plugin: v4.5.2 → v5.1.1
- cross-spawn: v6.0.5 → v7.0.1
- css-loader: v1.0.0 → v3.4.2
- detect-port: v1.2.3 → v1.3.0
- figures: v2.0.0 → v3.2.0
- filesize: v3.6.1 → v6.1.0
- file-loader: v1.1.11 → v4.3.0
- fs-extra: v7.0.0 → v8.1.0
- glob: v7.1.3 → v7.1.6
- gzip-size: v5.0.0 → v5.1.1
- inquirer: v6.0.0 → v7.0.6
- karma: v2.0.0 → v4.4.1
- karma-chrome-launcher: v2.2.0 → v3.1.0
- karma-coverage: v1.1.2 → v2.0.1
- karma-webpack: v3.0.0 → v4.0.2
- mini-css-extract-plugin v0.4.1 → v0.9.0
- mocha: v5.2.0 → v7.1.0
- opn: v5.3.0 → open v7.0.2
- ora: v3.0.0 → v4.0.3
- postcss-loader: v2.1.6 → v3.0.0 - dropped Node.js 4 support
- promise: v8.0.1 → v8.1.0
- resolve: v1.8.1 → v1.15.1
- semver: v5.5.1 → v7.1.3
- style-loader: v0.21.0 → v1.1.3
- uglifyjs-webpack-plugin v1.2.7 → terser-webpack-plugin v2.3.5
- url-loader: v1.0.1 → v2.3.0
- webpack: v4.16.4 → v4.42.0
- webpack-dev-middleware: v3.1.3 → v3.7.2
- webpack-dev-server: v3.1.5 → v3.10.3
- webpack-hot-middleware: v2.22.3 → v2.25.0
- webpack-merge: v4.1.4 → v4.2.2
- whatwg-fetch: v2.0.4 → v3.0.0
Older changelogs are available in the CHANGES archive.