Adjust our Content Security Policy on production so that it is more
restrictive than when we run in development mode. Changes include:
- Do not allow loading content/scripts/fonts from localhost
- Do not allow running code that contains `eval` statements
Use `CspHtmlWebpackPlugin` to generate our content security policy
using code rather than hard coding meta tags on our html index page.
This provides us a more flexible means to configure our CSP dynamically.
Use `HtmlWebpackPlugin` to generate our final html file so that we can
remove our inline scripts and insert them dynamically based on our
webpack config.
Webpack environment `mode` is defined directly in our environment
specific webpack config files. Due to this, we no longer need to
manually set `NODE_ENV` or check to ensure that it has been set.
See:
- https://webpack.js.org/concepts/mode/
Webpack v4 introduced a new `mode` setting, which - amongst other
things - automates the definition of the NODE_ENV environment variable.
We already had the `mode` settings set in our webpack configs so this
change is just to clean up some redundant code that is handled
automatically by this setting.
See:
- https://webpack.js.org/concepts/mode/
Update all webpack packages to the latest v4.x compatible versions and
update supporting configs. This delivers noticeable performance
improvements to the DX.