Upgrade to webpack 4

The webpack community just released webpack v4. Upgrade to it.

Amongst the relevant upstream changes, the uglify plugin and
commonschunk plugins are no longer needed as their behavior is now just
builtin. The webpack.LoaderOptionsPlugin is no longer needed, it existed
to ease transition from webpack 1 to webpack 2. minify is now an option
to optimization.

Change-Id: I0359f69861211231e4875abf9817316d9e8878a1
This commit is contained in:
Monty Taylor 2018-03-10 09:19:28 -06:00
parent d716119a99
commit c1422429df
No known key found for this signature in database
GPG Key ID: 7BAE94BC7141A594
6 changed files with 1956 additions and 770 deletions

View File

@ -38,23 +38,24 @@
"babel-plugin-angularjs-annotate": "^0.8.2",
"babel-preset-env": "^1.6.1",
"clean-webpack-plugin": "^0.1.16",
"css-loader": "^0.28.4",
"css-loader": "^0.28.10",
"eslint": ">=3.19.0",
"eslint-config-standard": "^11.0.0-beta.0",
"eslint-loader": "^1.9.0",
"eslint-loader": "^2.0.0",
"eslint-plugin-import": "^2.8.0",
"eslint-plugin-node": "^6.0.0",
"eslint-plugin-promise": "^3.6.0",
"eslint-plugin-standard": "^3.0.1",
"file-loader": "^0.11.2",
"html-webpack-plugin": "^2.29.0",
"file-loader": "^1.1.11",
"html-webpack-plugin": "^3.0.0",
"resolve-url-loader": "^2.1.0",
"style-loader": "^0.18.2",
"style-loader": "^0.20.3",
"url-loader": "^0.5.9",
"webpack": "^3.3.0",
"webpack": "^4.4.0",
"webpack-archive-plugin": "^3.0.0",
"webpack-bundle-analyzer": "^2.9.1",
"webpack-dev-server": "^2.6.1",
"webpack-cli": "^2.0.11",
"webpack-dev-server": "^3.0.0",
"webpack-merge": "^4.1.0"
}
}

View File

@ -1,20 +1,9 @@
const path = require('path');
const webpack = require('webpack');
const HtmlWebpackPlugin = require('html-webpack-plugin');
const CleanWebpackPlugin = require('clean-webpack-plugin');
module.exports = {
entry: {
main: './web/main.js',
// Tell webpack to extract 3rd party depdenencies which change less
// frequently.
vendor: [
'angular',
'bootstrap/dist/css/bootstrap.css',
'jquery-visibility/jquery-visibility',
'graphitejs/jquery.graphite.js'
]
},
entry: './web/main.js',
output: {
filename: '[name].js',
// path.resolve(__dirname winds up relative to the config dir
@ -25,19 +14,23 @@ module.exports = {
// expensive to build for prod. Debugging without the full source-map sucks,
// so define it here in common.
devtool: 'source-map',
optimization: {
runtimeChunk: true,
splitChunks: {
cacheGroups: {
commons: {
test: /node_modules/,
name: "vendor",
chunks: "all"
}
}
}
},
plugins: [
new webpack.ProvidePlugin({
$: 'jquery/dist/jquery',
jQuery: 'jquery/dist/jquery',
}),
new webpack.optimize.CommonsChunkPlugin({
name: 'vendor',
}),
new webpack.optimize.CommonsChunkPlugin({
name: 'manifest',
}),
new CleanWebpackPlugin(
['zuul/web/static'], { root: path.resolve(__dirname, '../..')}),
// Each of the entries below lists a specific 'chunk' which is one of the
// entry items from above. We can collapse this to just do one single
// output file.

View File

@ -4,7 +4,7 @@ const Merge = require('webpack-merge');
const CommonConfig = require('./webpack.common.js');
module.exports = Merge(CommonConfig, {
mode: 'development',
// Enable Hot Module Replacement for devServer
devServer: {
hot: true,

View File

@ -5,7 +5,7 @@ const CommonConfig = require('./webpack.common.js');
const BundleAnalyzerPlugin = require('webpack-bundle-analyzer').BundleAnalyzerPlugin;
module.exports = Merge(CommonConfig, {
mode: 'development',
module: {
rules: [
{

View File

@ -2,42 +2,25 @@ const path = require('path');
const webpack = require('webpack');
const Merge = require('webpack-merge');
const CommonConfig = require('./webpack.common.js');
const CleanWebpackPlugin = require('clean-webpack-plugin');
const ArchivePlugin = require('webpack-archive-plugin');
module.exports = Merge(CommonConfig, {
mode: 'production',
output: {
filename: '[name].[chunkhash].js',
// path.resolve(__dirname winds up relative to the config dir
path: path.resolve(__dirname, '../../zuul/web/static'),
publicPath: ''
},
optimization: {
minimize: true
},
plugins: [
new webpack.LoaderOptionsPlugin({
minimize: true,
debug: false
}),
new webpack.DefinePlugin({
'process.env': {
'NODE_ENV': JSON.stringify('production')
}
}),
new CleanWebpackPlugin(
['zuul/web/static'], { root: path.resolve(__dirname, '../..')}),
// Keeps the vendor bundle from changing needlessly.
new webpack.HashedModuleIdsPlugin(),
new webpack.optimize.UglifyJsPlugin({
warningsFilter: function(filename) {
return ! /node_modules/.test(filename);
},
beautify: false,
mangle: {
screw_ie8: true,
keep_fnames: true
},
compress: {
screw_ie8: true
},
sourceMap: true,
comments: false
}),
new ArchivePlugin({
output: path.resolve(__dirname, '../../zuul-web'),
format: [

2643
yarn.lock

File diff suppressed because it is too large Load Diff