Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

Sign up for GitHub

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Jump to bottom

[BREAKING CHANGE] webpack 4 #3148

Merged
merged 26 commits into from
Mar 26, 2018
Merged

[BREAKING CHANGE] webpack 4 #3148

Show file tree
Hide file tree
Changes from 25 commits
Commits
Show all changes
26 commits
Select commit Hold shift + click to select a range
262ff53
Initial move to Webpack 4
Hypnosphi Mar 4, 2018
86383b5
Merge remote-tracking branch 'origin/master' into webpack-4
Hypnosphi Mar 4, 2018
120a273
Migrate all apps to Webpack 4
Hypnosphi Mar 4, 2018
f85a485
Merge branch 'master' into webpack-4
Hypnosphi Mar 6, 2018
2437859
Merge remote-tracking branch 'origin/master' into webpack-4
Hypnosphi Mar 8, 2018
7c1ec3a
Update webpack & Co
Hypnosphi Mar 8, 2018
ea61da5
Use optimization.splitChunks & optimization.runtimeChunks to split ve…
Hypnosphi Mar 9, 2018
19bf35f
Revert "Use optimization.splitChunks & optimization.runtimeChunks to …
Hypnosphi Mar 9, 2018
19919e5
Merge branch 'master' into webpack-4
Hypnosphi Mar 9, 2018
f540b97
Merge branch 'master' into webpack-4
Hypnosphi Mar 18, 2018
1c768d9
Update webpack-related deps
Hypnosphi Mar 18, 2018
8f150e7
Merge branch 'master' into webpack-4
Hypnosphi Mar 18, 2018
2333068
Merge branch 'master' into webpack-4
ndelangen Mar 20, 2018
1ce3a1e
Merge branch 'master' into webpack-4
ndelangen Mar 20, 2018
c863304
Merge remote-tracking branch 'origin/master' into webpack-4
Hypnosphi Mar 20, 2018
dff3cd6
Use a temporary fork of react-dev-utils
Hypnosphi Mar 20, 2018
8ac0ab3
Merge remote-tracking branch 'origin/master' into webpack-4
Hypnosphi Mar 20, 2018
c9ef7a5
Merge branch 'master' into webpack-4
Hypnosphi Mar 20, 2018
d16f2d7
Merge branch 'master' into webpack-4
Hypnosphi Mar 21, 2018
9be830c
Merge remote-tracking branch 'origin/master' into webpack-4
Hypnosphi Mar 23, 2018
6f31eb4
Revert named imports order change
Hypnosphi Mar 23, 2018
4699f05
Merge branch 'master' into webpack-4
ndelangen Mar 26, 2018
ba89b47
Use published fork of react-dev-utils
Hypnosphi Mar 26, 2018
48b92e6
Use original react-dev-utils
Hypnosphi Mar 26, 2018
aaa4fed
Merge branch 'master' into webpack-4
ndelangen Mar 26, 2018
530cc59
Update webpack & friends
Hypnosphi Mar 26, 2018
File filter

Filter by extension

Filter by extension
Conversations
Failed to load comments.
Jump to
Jump to file
Failed to load files.
Diff view
Diff view
2 changes: 2 additions & 0 deletions .eslintignore
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -3,6 +3,8 @@ build
coverage
node_modules
docs/public
storybook-static
built-storybooks
lib/cli/test
*.bundle.js
*.js.map
Expand Down
7 changes: 3 additions & 4 deletions app/angular/package.json
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -41,7 +41,7 @@
"dotenv-webpack": "^1.5.5",
"global": "^4.3.2",
"html-loader": "^0.5.5",
"html-webpack-plugin": "^2.30.1",
"html-webpack-plugin": "^3.0.7",
"json5": "^0.5.1",
"markdown-loader": "^2.0.2",
"node-sass": "^4.8.3",
Expand All @@ -50,10 +50,9 @@
"react-dev-utils": "^5.0.0",
"react-dom": "^16.0.0",
"sass-loader": "^6.0.7",
"ts-loader": "^3.5.0",
"uglifyjs-webpack-plugin": "^1.2.4",
"ts-loader": "^4.1.0",
"util-deprecate": "^1.0.2",
"webpack": "^3.11.0",
"webpack": "^4.1.1",
"webpack-hot-middleware": "^2.21.2",
"zone.js": "^0.8.20"
},
Expand Down
3 changes: 2 additions & 1 deletion app/angular/src/server/config/webpack.config.js
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -14,6 +14,7 @@ import { version } from '../../../package.json';

export default function(configDir) {
const config = {
mode: 'development',
devtool: 'cheap-module-source-map',
entry: {
manager: [require.resolve('./polyfills'), managerPath],
Expand All @@ -29,7 +30,6 @@ export default function(configDir) {
publicPath: '/',
},
plugins: [
new InterpolateHtmlPlugin(process.env),
new HtmlWebpackPlugin({
filename: 'index.html',
chunks: ['manager'],
Expand All @@ -47,6 +47,7 @@ export default function(configDir) {
},
template: require.resolve('../iframe.html.ejs'),
}),
new InterpolateHtmlPlugin(process.env),
new webpack.DefinePlugin(loadEnv()),
new webpack.HotModuleReplacementPlugin(),
new CaseSensitivePathsPlugin(),
Expand Down
18 changes: 2 additions & 16 deletions app/angular/src/server/config/webpack.config.prod.js
View file
Open in desktop
Original file line number Diff line number Diff line change
@@ -1,6 +1,5 @@
import path from 'path';
import webpack from 'webpack';
import UglifyJsPlugin from 'uglifyjs-webpack-plugin';
import Dotenv from 'dotenv-webpack';
import InterpolateHtmlPlugin from 'react-dev-utils/InterpolateHtmlPlugin';
import HtmlWebpackPlugin from 'html-webpack-plugin';
Expand All @@ -18,6 +17,7 @@ export default function(configDir) {
};

const config = {
mode: 'production',
bail: true,
devtool: '#cheap-module-source-map',
entry: entries,
Expand All @@ -31,7 +31,6 @@ export default function(configDir) {
publicPath: '',
},
plugins: [
new InterpolateHtmlPlugin(process.env),
new HtmlWebpackPlugin({
filename: 'index.html',
chunks: ['manager'],
Expand All @@ -49,21 +48,8 @@ export default function(configDir) {
},
template: require.resolve('../iframe.html.ejs'),
}),
new InterpolateHtmlPlugin(process.env),
new webpack.DefinePlugin(loadEnv({ production: true })),
new UglifyJsPlugin({
parallel: true,
uglifyOptions: {
ie8: false,
mangle: false,
warnings: false,
compress: {
keep_fnames: true,
},
output: {
comments: false,
},
},
}),
new webpack.ContextReplacementPlugin(
/angular(\\|\/)core(\\|\/)(@angular|esm5)/,
path.resolve(__dirname, '../src')
Expand Down
5 changes: 2 additions & 3 deletions app/polymer/package.json
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -46,14 +46,13 @@
"dotenv-webpack": "^1.5.5",
"find-cache-dir": "^1.0.0",
"global": "^4.3.2",
"html-webpack-plugin": "^2.30.1",
"html-webpack-plugin": "^3.0.7",
"json5": "^0.5.1",
"react": "^16.0.0",
"react-dev-utils": "^5.0.0",
"react-dom": "^16.0.0",
"uglifyjs-webpack-plugin": "^1.2.4",
"util-deprecate": "^1.0.2",
"webpack": "^3.11.0",
"webpack": "^4.1.1",
"webpack-hot-middleware": "^2.21.2"
},
"devDependencies": {
Expand Down
3 changes: 2 additions & 1 deletion app/polymer/src/server/config/webpack.config.js
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -15,6 +15,7 @@ import { version } from '../../../package.json';

export default function(configDir) {
const config = {
mode: 'development',
devtool: 'cheap-module-source-map',
entry: {
manager: [require.resolve('./polyfills'), managerPath],
Expand All @@ -30,7 +31,6 @@ export default function(configDir) {
publicPath: '/',
},
plugins: [
new InterpolateHtmlPlugin(process.env),
new HtmlWebpackPlugin({
filename: 'index.html',
chunks: ['manager'],
Expand All @@ -48,6 +48,7 @@ export default function(configDir) {
},
template: require.resolve('../iframe.html.ejs'),
}),
new InterpolateHtmlPlugin(process.env),
new CopyWebpackPlugin([
{ from: require.resolve('@webcomponents/webcomponentsjs/webcomponents-lite.js') },
{ from: require.resolve('@webcomponents/webcomponentsjs/custom-elements-es5-adapter.js') },
Expand Down
18 changes: 2 additions & 16 deletions app/polymer/src/server/config/webpack.config.prod.js
View file
Open in desktop
Original file line number Diff line number Diff line change
@@ -1,5 +1,4 @@
import webpack from 'webpack';
import UglifyJsPlugin from 'uglifyjs-webpack-plugin';
import Dotenv from 'dotenv-webpack';
import InterpolateHtmlPlugin from 'react-dev-utils/InterpolateHtmlPlugin';
import HtmlWebpackPlugin from 'html-webpack-plugin';
Expand All @@ -17,6 +16,7 @@ export default function(configDir) {
};

const config = {
mode: 'production',
bail: true,
devtool: '#cheap-module-source-map',
entry: entries,
Expand All @@ -30,7 +30,6 @@ export default function(configDir) {
publicPath: '',
},
plugins: [
new InterpolateHtmlPlugin(process.env),
new HtmlWebpackPlugin({
filename: 'index.html',
chunks: ['manager'],
Expand All @@ -48,25 +47,12 @@ export default function(configDir) {
},
template: require.resolve('../iframe.html.ejs'),
}),
new InterpolateHtmlPlugin(process.env),
new CopyWebpackPlugin([
{ from: require.resolve('@webcomponents/webcomponentsjs/webcomponents-lite.js') },
{ from: require.resolve('@webcomponents/webcomponentsjs/custom-elements-es5-adapter.js') },
]),
new webpack.DefinePlugin(loadEnv({ production: true })),
new UglifyJsPlugin({
parallel: true,
uglifyOptions: {
ie8: false,
mangle: false,
warnings: false,
compress: {
keep_fnames: true,
},
output: {
comments: false,
},
},
}),
new Dotenv({ silent: true }),
],
module: {
Expand Down
7 changes: 3 additions & 4 deletions app/react-native/package.json
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -49,20 +49,19 @@
"find-cache-dir": "^1.0.0",
"global": "^4.3.2",
"html-loader": "^0.5.5",
"html-webpack-plugin": "^2.30.1",
"html-webpack-plugin": "^3.0.7",
"json5": "^0.5.1",
"markdown-loader": "^2.0.2",
"prop-types": "^15.6.1",
"react-dev-utils": "^5.0.0",
"react-native-compat": "^1.0.0",
"react-native-iphone-x-helper": "^1.0.2",
"shelljs": "^0.8.1",
"uglifyjs-webpack-plugin": "^1.2.4",
"url-parse": "^1.1.9",
"util-deprecate": "^1.0.2",
"uuid": "^3.2.1",
"webpack": "^3.11.0",
"webpack-dev-middleware": "^1.12.2",
"webpack": "^4.1.1",
"webpack-dev-middleware": "^3.0.1",
"webpack-hot-middleware": "^2.21.2",
"ws": "^4.1.0"
},
Expand Down
7 changes: 0 additions & 7 deletions app/react-native/src/server/config/utils.js
View file
Open in desktop
Original file line number Diff line number Diff line change
@@ -1,12 +1,5 @@
import webpack from 'webpack';
import path from 'path';

export const OccurenceOrderPlugin =
// for webpack 2
webpack.optimize.OccurrenceOrderPlugin ||
// for webpack 1
webpack.optimize.OccurenceOrderPlugin;

export const includePaths = [path.resolve('./')];

export const excludePaths = [path.resolve('./node_modules')];
Expand Down
4 changes: 2 additions & 2 deletions app/react-native/src/server/config/webpack.config.js
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -3,9 +3,10 @@ import webpack from 'webpack';
import WatchMissingNodeModulesPlugin from 'react-dev-utils/WatchMissingNodeModulesPlugin';
import CaseSensitivePathsPlugin from 'case-sensitive-paths-webpack-plugin';
import HtmlWebpackPlugin from 'html-webpack-plugin';
import { OccurenceOrderPlugin, includePaths, excludePaths, nodeModulesPaths } from './utils';
import { includePaths, excludePaths, nodeModulesPaths } from './utils';

const getConfig = options => ({
mode: 'development',
devtool: '#cheap-module-eval-source-map',
entry: {
manager: [require.resolve('../../manager')],
Expand All @@ -23,7 +24,6 @@ const getConfig = options => ({
},
template: require.resolve('../index.html.ejs'),
}),
new OccurenceOrderPlugin(),
new webpack.HotModuleReplacementPlugin(),
new CaseSensitivePathsPlugin(),
new WatchMissingNodeModulesPlugin(nodeModulesPaths),
Expand Down
24 changes: 2 additions & 22 deletions app/react-native/src/server/config/webpack.config.prod.js
View file
Open in desktop
Original file line number Diff line number Diff line change
@@ -1,11 +1,11 @@
import path from 'path';
import webpack from 'webpack';
import UglifyJsPlugin from 'uglifyjs-webpack-plugin';
import HtmlWebpackPlugin from 'html-webpack-plugin';
import { OccurenceOrderPlugin, includePaths, excludePaths } from './utils';
import { includePaths, excludePaths } from './utils';

const getConfig = options => {
const config = {
mode: 'production',
bail: true,
devtool: '#cheap-module-source-map',
entry: {
Expand All @@ -31,20 +31,6 @@ const getConfig = options => {
}),
new webpack.DefinePlugin({ 'process.env.NODE_ENV': '"production"' }),
new webpack.optimize.DedupePlugin(),
new UglifyJsPlugin({
parallel: true,
uglifyOptions: {
ie8: false,
mangle: false,
warnings: false,
compress: {
keep_fnames: true,
},
output: {
comments: false,
},
},
}),
],
module: {
rules: [
Expand All @@ -70,12 +56,6 @@ const getConfig = options => {
},
};

// Webpack 2 doesn't have a OccurenceOrderPlugin plugin in the production mode.
// But webpack 1 has it. That's why we do this.
if (OccurenceOrderPlugin) {
config.plugins.unshift(new OccurenceOrderPlugin());
}

return config;
};

Expand Down
5 changes: 2 additions & 3 deletions app/react/package.json
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -51,15 +51,14 @@
"glamorous": "^4.12.1",
"global": "^4.3.2",
"html-loader": "^0.5.5",
"html-webpack-plugin": "^2.30.1",
"html-webpack-plugin": "^3.0.7",
"json5": "^0.5.1",
"lodash.flattendeep": "^4.4.0",
"markdown-loader": "^2.0.2",
"prop-types": "^15.6.1",
"react-dev-utils": "^5.0.0",
"uglifyjs-webpack-plugin": "^1.2.4",
"util-deprecate": "^1.0.2",
"webpack": "^3.11.0",
"webpack": "^4.1.1",
"webpack-hot-middleware": "^2.21.2"
},
"devDependencies": {
Expand Down
3 changes: 2 additions & 1 deletion app/react/src/server/config/webpack.config.js
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -14,6 +14,7 @@ import { version } from '../../../package.json';

export default function(configDir) {
const config = {
mode: 'development',
devtool: 'cheap-module-source-map',
entry: {
manager: [require.resolve('./polyfills'), managerPath],
Expand All @@ -29,7 +30,6 @@ export default function(configDir) {
publicPath: '/',
},
plugins: [
new InterpolateHtmlPlugin(process.env),
new HtmlWebpackPlugin({
filename: 'index.html',
chunks: ['manager'],
Expand All @@ -47,6 +47,7 @@ export default function(configDir) {
},
template: require.resolve('../iframe.html.ejs'),
}),
new InterpolateHtmlPlugin(process.env),
new webpack.DefinePlugin(loadEnv()),
new webpack.HotModuleReplacementPlugin(),
new CaseSensitivePathsPlugin(),
Expand Down
18 changes: 2 additions & 16 deletions app/react/src/server/config/webpack.config.prod.js
View file
Open in desktop
Original file line number Diff line number Diff line change
@@ -1,5 +1,4 @@
import webpack from 'webpack';
import UglifyJsPlugin from 'uglifyjs-webpack-plugin';
import Dotenv from 'dotenv-webpack';
import InterpolateHtmlPlugin from 'react-dev-utils/InterpolateHtmlPlugin';
import HtmlWebpackPlugin from 'html-webpack-plugin';
Expand All @@ -16,6 +15,7 @@ export default function(configDir) {
};

const config = {
mode: 'production',
bail: true,
devtool: '#cheap-module-source-map',
entry: entries,
Expand All @@ -29,7 +29,6 @@ export default function(configDir) {
publicPath: '',
},
plugins: [
new InterpolateHtmlPlugin(process.env),
new HtmlWebpackPlugin({
filename: 'index.html',
chunks: ['manager'],
Expand All @@ -47,21 +46,8 @@ export default function(configDir) {
},
template: require.resolve('../iframe.html.ejs'),
}),
new InterpolateHtmlPlugin(process.env),
new webpack.DefinePlugin(loadEnv({ production: true })),
new UglifyJsPlugin({
parallel: true,
uglifyOptions: {
ie8: false,
mangle: false,
warnings: false,
compress: {
keep_fnames: true,
},
output: {
comments: false,
},
},
Copy link
Member Author

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

@ndelangen should we replicate those settings in optimization.minimizer option, or are we OK with webpack defaults?

Copy link
Member

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Let's try to use their defaults!

}),
new Dotenv({ silent: true }),
],
module: {
Expand Down