Mar 5, 2018 · Mar 6, 2018 · Mar 6, 2018 · Mar 6, 2018 · Mar 6, 2018 · Mar 6, 2018
diff --git a/build/webpack.base.config.js b/build/webpack.base.config.js
    maxEntrypointSize: 300000,
    hints: isProd ? 'warning' : false
  },
  mode: process.env.NODE_ENV || 'development',
  plugins: isProd
    ? [
        new webpack.optimize.UglifyJsPlugin({
          compress: { warnings: false }
        }),
        new webpack.optimize.ModuleConcatenationPlugin(),
        new ExtractTextPlugin({
          filename: 'common.[chunkhash].css'
          filename: 'common.[chunkhash].css',
          allChunks: true
        })
      ]
    : [
        new FriendlyErrorsPlugin()
      ]
 }
 }
diff --git a/build/webpack.client.config.js b/build/webpack.client.config.js
  plugins: [
    // strip dev-only code in Vue source
    new webpack.DefinePlugin({
      'process.env.NODE_ENV': JSON.stringify(process.env.NODE_ENV || 'development'),
      'process.env.VUE_ENV': '"client"'
    }),
    // extract vendor chunks for better caching
    new webpack.optimize.CommonsChunkPlugin({
      name: 'vendor',
      minChunks: function (module) {
        // a module is extracted into the vendor chunk if...
        return (
          // it's inside node_modules
          /node_modules/.test(module.context) &&
          // and not a CSS file (due to extract-text-webpack-plugin limitation)
          !/\.css$/.test(module.request)
        )
      }
    }),
    // extract webpack runtime & manifest to avoid vendor chunk hash changing
    // on every build.
    new webpack.optimize.CommonsChunkPlugin({
      name: 'manifest'
    }),
    new VueSSRClientPlugin()
  ]
  ],
  optimization:{
        runtimeChunk: {
            name: "manifest"
        },
      // extract webpack runtime & manifest to avoid vendor chunk hash changing
      // on every build.
      // extract vendor chunks for better caching
        splitChunks:{
            chunks:"initial",
            cacheGroups: {
                vendors: function (module) {
                    // a module is extracted into the vendor chunk if...
                    return (
                        // it's inside node_modules
                        /node_modules/.test(module.context) &&
                        // and not a CSS file (due to extract-text-webpack-plugin limitation)
                        !/\.css$/.test(module.request)
                    )
                }
            }
        }
    },
 })

 if (process.env.NODE_ENV === 'production') {
Original file line number	Diff line number	Diff line change
Expand Up		@@ -56,17 +56,16 @@ module.exports = {
		maxEntrypointSize: 300000,
		hints: isProd ? 'warning' : false
		},
		mode: process.env.NODE_ENV \|\| 'development',
		plugins: isProd
		? [
		new webpack.optimize.UglifyJsPlugin({
		compress: { warnings: false }
		}),
		new webpack.optimize.ModuleConcatenationPlugin(),
		new ExtractTextPlugin({
		filename: 'common.[chunkhash].css'
		filename: 'common.[chunkhash].css',
		allChunks: true
Copy link Contributor JounQinMar 6, 2018 Choose a reason for hiding this comment The reason will be displayed to describe this comment to others.Learn more. Why change it? Copy link ContributorAuthor RezaHaidariMar 6, 2018 Choose a reason for hiding this comment The reason will be displayed to describe this comment to others.Learn more. "extract-text-webpack-plugin" get error : TypeError: Cannot read property 'call' of undefined Fixing it, by adding allChunks: true webpack/webpack#959 Copy link asadsahiMar 6, 2018• edited Loading Choose a reason for hiding this comment The reason will be displayed to describe this comment to others.Learn more. @RezaHaidari I can't see any issues with existing ExtractTextPlugin config. Also following config isn't needed as well I guess as by setting mode to production it minifies the code anyway. `if (isProd) { config.optimization = { ...config.optimization, minimizer: [ new UglifyJsPlugin({ sourceMap: true, uglifyOptions: { compress: { inline: false, }, }, }), ], };}` Any comments? Copy link ContributorAuthor RezaHaidariMar 6, 2018 Choose a reason for hiding this comment The reason will be displayed to describe this comment to others.Learn more. `b4b2e33`
		})
		]
		: [
		new FriendlyErrorsPlugin()
		]
		}
		}
Original file line number	Diff line number	Diff line change
Expand Up		@@ -16,29 +16,32 @@ const config = merge(base, {
		plugins: [
		// strip dev-only code in Vue source
		new webpack.DefinePlugin({
		'process.env.NODE_ENV': JSON.stringify(process.env.NODE_ENV \|\| 'development'),
		'process.env.VUE_ENV': '"client"'
		}),
		// extract vendor chunks for better caching
		new webpack.optimize.CommonsChunkPlugin({
		name: 'vendor',
		minChunks: function (module) {
		// a module is extracted into the vendor chunk if...
		return (
		// it's inside node_modules
		/node_modules/.test(module.context) &&
		// and not a CSS file (due to extract-text-webpack-plugin limitation)
		!/\.css$/.test(module.request)
		)
		}
		}),
		// extract webpack runtime & manifest to avoid vendor chunk hash changing
		// on every build.
		new webpack.optimize.CommonsChunkPlugin({
		name: 'manifest'
		}),
		new VueSSRClientPlugin()
		]
		],
		optimization:{
		runtimeChunk: {
		name: "manifest"
		},
		// extract webpack runtime & manifest to avoid vendor chunk hash changing
		// on every build.
		// extract vendor chunks for better caching
		splitChunks:{
		chunks:"initial",
		cacheGroups: {
		vendors: function (module) {
Copy link FranckFreiburgerOct 25, 2018 Choose a reason for hiding this comment The reason will be displayed to describe this comment to others.Learn more. I tried your code using webpack 4.23.1 and it fails with a "TypeError: cacheGroup.getName is not a function" The correct form for cacheGroups entries seems different (seehttps://webpack.js.org/plugins/split-chunks-plugin/#splitchunks-cachegroups) `vendors: { test: function(module) {`
		// a module is extracted into the vendor chunk if...
		return (
		// it's inside node_modules
		/node_modules/.test(module.context) &&
		// and not a CSS file (due to extract-text-webpack-plugin limitation)
Copy link FranckFreiburgerOct 25, 2018 Choose a reason for hiding this comment The reason will be displayed to describe this comment to others.Learn more. due to extract-text-webpack-plugin limitation I wondering if`mini-css-extract-plugin` has the same limitation ?
		!/\.css$/.test(module.request)
		)
		}
		}
		}
		},
		})

		if (process.env.NODE_ENV === 'production') {
Expand Down