From ac83a9e1728715e7df39d3af8aff03c5271a938d Mon Sep 17 00:00:00 2001 From: Vitaly Takmazov Date: Mon, 18 Jun 2018 13:06:44 +0300 Subject: webpack optimizations --- vnext/webpack.config.js | 84 +++++++++++++++++++++++++++++++++++++++---------- 1 file changed, 67 insertions(+), 17 deletions(-) (limited to 'vnext/webpack.config.js') diff --git a/vnext/webpack.config.js b/vnext/webpack.config.js index 4c32597c..f63beb4c 100644 --- a/vnext/webpack.config.js +++ b/vnext/webpack.config.js @@ -1,5 +1,9 @@ const webpack = require('webpack'); +const path = require('path'); +const HtmlWebPackPlugin = require("html-webpack-plugin"); const MiniCssExtractPlugin = require('mini-css-extract-plugin'); +const UglifyJsPlugin = require("uglifyjs-webpack-plugin"); +const OptimizeCSSAssetsPlugin = require("optimize-css-assets-webpack-plugin"); const history = require('connect-history-api-fallback'); const convert = require('koa-connect'); const internalIp = require('internal-ip'); @@ -9,13 +13,17 @@ module.exports = { mode: process.env.WEBPACK_SERVE ? 'development' : 'production', entry: { 'Juick': [ - 'babel-polyfill', 'whatwg-fetch', - 'file-loader?name=index.html!./src/views/index.html', __dirname + '/src/index.js', __dirname + '/src/style/main.css' ] }, + output: { + filename: process.env.WEBPACK_SERVE ? '[name].js' : '[name].[chunkhash].bundle.js', + chunkFilename: process.env.WEBPACK_SERVE ? '[name].js' : '[name].[chunkhash].bundle.js', + publicPath: '/', + path: path.resolve(__dirname, 'dist') + }, module: { rules: [ { @@ -36,27 +44,69 @@ module.exports = { } ] }, - - { test: /\.js$/, exclude: /node_modules\/(?!query-string)/, loader: 'babel-loader' }, - { test: /\.(jpe?g|png|gif|svg)$/i, loaders: [ - 'file-loader?hash=sha512&digest=hex&name=[hash].[ext]' - ]} - ] + { + test: /\.html$/, + use: [ + { + loader: "html-loader", + options: { minimize: true } + } + ] + }, + { + test: /\.js$/, + exclude: /node_modules/, + loader: 'babel-loader' + }, + { + test: /\.(jpe?g|png|gif|svg)$/i, + loaders: [ + 'file-loader?hash=sha512&digest=hex&name=[hash].[ext]' + ] + } + ] + }, + optimization: { + minimizer: [ + new UglifyJsPlugin({ + cache: true, + parallel: true, + sourceMap: Boolean(process.env.WEBPACK_SERVE) + }), + new OptimizeCSSAssetsPlugin({}) + ], + splitChunks: { + cacheGroups: { + vendor: { + test: /node_modules/, + chunks: 'initial', + name: 'vendor', + enforce: true + }, + } + } }, plugins: [ new webpack.IgnorePlugin(/^\.\/locale$/, /moment$/), - new MiniCssExtractPlugin({ filename: "Juick.css", allChunks: true }) + new MiniCssExtractPlugin({ + filename: "Juick.[contenthash].css", + allChunks: true + }), + new HtmlWebPackPlugin({ + template: "./src/views/index.html", + filename: "./index.html" + }) ], }; module.exports.serve = { - content: [__dirname], - host: internalIp.v4.sync(), - add: (app, middleware, options) => { - const historyOptions = { - // ... see: https://github.com/bripkens/connect-history-api-fallback#options - }; + content: [__dirname], + host: internalIp.v4.sync(), + add: (app, middleware, options) => { + const historyOptions = { + // ... see: https://github.com/bripkens/connect-history-api-fallback#options + }; - app.use(convert(history(historyOptions))); - } + app.use(convert(history(historyOptions))); + } }; -- cgit v1.2.3