From 8230354d1b8e8289f86b9bea7a53aaaa8cece184 Mon Sep 17 00:00:00 2001 From: Clark Du Date: Wed, 22 Aug 2018 15:24:47 +0100 Subject: [PATCH] feat: webpack refactor (#3747) * refactor: use more standard entrypoint config * refactor: fix dev entry name * refactor: webpack devtool and optimization --- lib/builder/webpack/base.js | 11 ++++++++- lib/builder/webpack/client.js | 46 +++++++++++++++++++---------------- lib/builder/webpack/server.js | 24 +++++++++++------- 3 files changed, 50 insertions(+), 31 deletions(-) diff --git a/lib/builder/webpack/base.js b/lib/builder/webpack/base.js index a2033bb7b2..dbda780db4 100644 --- a/lib/builder/webpack/base.js +++ b/lib/builder/webpack/base.js @@ -60,6 +60,10 @@ export default class WebpackBaseConfig { return fileName } + devtool() { + return false + } + env() { const env = { 'process.mode': JSON.stringify(this.options.mode), @@ -85,6 +89,10 @@ export default class WebpackBaseConfig { } } + optimization() { + return this.options.build.optimization + } + alias() { return { '~': path.join(this.options.srcDir), @@ -281,7 +289,8 @@ export default class WebpackBaseConfig { const config = { name: this.name, mode: this.options.dev ? 'development' : 'production', - optimization: {}, + devtool: this.devtool(), + optimization: this.optimization(), output: this.output(), performance: { maxEntrypointSize: 1000 * 1024, diff --git a/lib/builder/webpack/client.js b/lib/builder/webpack/client.js index 41aedb99d9..7a61865c5a 100644 --- a/lib/builder/webpack/client.js +++ b/lib/builder/webpack/client.js @@ -23,6 +23,26 @@ export default class WebpackClientConfig extends WebpackBaseConfig { }) } + optimization() { + const optimization = super.optimization() + + // Small, known and common modules which are usually used project-wise + // Sum of them may not be more than 244 KiB + if ( + this.options.build.splitChunks.commons === true && + optimization.splitChunks.cacheGroups.commons === undefined + ) { + optimization.splitChunks.cacheGroups.commons = { + test: /node_modules[\\/](vue|vue-loader|vue-router|vuex|vue-meta|core-js|@babel\/runtime|axios|webpack|setimmediate|timers-browserify|process|regenerator-runtime|cookie|js-cookie|is-buffer|dotprop|nuxt\.js)[\\/]/, + chunks: 'all', + priority: 10, + name: true + } + } + + return optimization + } + plugins() { const plugins = super.plugins() @@ -103,34 +123,18 @@ export default class WebpackClientConfig extends WebpackBaseConfig { const config = super.config() // Entry points - config.entry = path.resolve(this.options.buildDir, 'client.js') - - // -- Optimization -- - config.optimization = this.options.build.optimization - - // Small, known and common modules which are usually used project-wise - // Sum of them may not be more than 244 KiB - if ( - this.options.build.splitChunks.commons === true && - config.optimization.splitChunks.cacheGroups.commons === undefined - ) { - config.optimization.splitChunks.cacheGroups.commons = { - test: /node_modules[\\/](vue|vue-loader|vue-router|vuex|vue-meta|core-js|@babel\/runtime|axios|webpack|setimmediate|timers-browserify|process|regenerator-runtime|cookie|js-cookie|is-buffer|dotprop|nuxt\.js)[\\/]/, - chunks: 'all', - priority: 10, - name: true - } + config.entry = { + app: [path.resolve(this.options.buildDir, 'client.js')] } // Add HMR support if (this.options.dev) { - config.entry = [ + config.entry.app.unshift( // https://github.com/glenjamin/webpack-hot-middleware#config `webpack-hot-middleware/client?name=client&reload=true&timeout=30000&path=${ this.options.router.base - }/__webpack_hmr`.replace(/\/\//g, '/'), - config.entry - ] + }/__webpack_hmr`.replace(/\/\//g, '/') + ) } // Add friendly error plugin diff --git a/lib/builder/webpack/server.js b/lib/builder/webpack/server.js index 7ca2570fd5..96680be6ed 100644 --- a/lib/builder/webpack/server.js +++ b/lib/builder/webpack/server.js @@ -12,6 +12,10 @@ export default class WebpackServerConfig extends BaseConfig { super(builder, { name: 'server', isServer: true }) } + devtool() { + return 'cheap-source-map' + } + env() { return Object.assign(super.env(), { 'process.env.VUE_ENV': JSON.stringify('server'), @@ -21,6 +25,13 @@ export default class WebpackServerConfig extends BaseConfig { }) } + optimization() { + return { + splitChunks: false, + minimizer: [] + } + } + plugins() { const plugins = super.plugins() plugins.push( @@ -35,13 +46,12 @@ export default class WebpackServerConfig extends BaseConfig { config() { const config = super.config() - // Config devtool - config.devtool = 'cheap-source-map' - Object.assign(config, { target: 'node', node: false, - entry: path.resolve(this.options.buildDir, 'server.js'), + entry: { + app: [path.resolve(this.options.buildDir, 'server.js')] + }, output: Object.assign({}, config.output, { filename: 'server-bundle.js', libraryTarget: 'commonjs2' @@ -50,11 +60,7 @@ export default class WebpackServerConfig extends BaseConfig { hints: false, maxAssetSize: Infinity }, - externals: [], - optimization: { - splitChunks: false, - minimizer: [] - } + externals: [] }) // https://webpack.js.org/configuration/externals/#externals