const HtmlWebpackPlugin = require('html-webpack-plugin') const { FilerWebpackPlugin } = require('filer/webpack') const NodePolyfillPlugin = require('node-polyfill-webpack-plugin') const webpack = require('webpack') const path = require('path') module.exports = { entry: { flow: './src/index.ts' }, devtool: 'inline-source-map', mode: 'production', module: { rules: [ { test: /\.less$/i, use: [ 'style-loader', 'css-loader', 'less-loader' ] }, { test: /\.css$/i, use: [ 'style-loader', 'css-loader' ] }, { test: /\.(png|jpe?g|gif)$/i, loader: 'file-loader', options: { outputPath: 'images' } }, { test: /\.ts$/, exclude: /node_modules/, use: 'babel-loader' }, { test: /\.js$/, use: ['source-map-loader'], enforce: 'pre' } ] }, resolve: { extensions: ['.tsx', '.ts', '.js'] }, output: { filename: '[name].bundle.js', path: path.resolve(__dirname, 'dist'), clean: true }, devServer: { static: { directory: path.join(__dirname, 'dist') }, compress: true, port: 9000 }, plugins: [new HtmlWebpackPlugin(), new FilerWebpackPlugin(), new NodePolyfillPlugin({ excludeAliases: ['console'] }), new webpack.optimize.MinChunkSizePlugin({ minChunkSize: 50000 }), new webpack.optimize.SplitChunksPlugin({ minSize: 45000, maxSize: 110000 }) ], optimization: { splitChunks: { chunks: 'async', minSize: 20000, minRemainingSize: 0, minChunks: 1, maxAsyncRequests: 30, maxInitialRequests: 30, enforceSizeThreshold: 50000, cacheGroups: { commons: { test: /[\\/]node_modules[\\/]/, name: 'vendor', chunks: 'initial', reuseExistingChunk: true }, default: { minChunks: 2, reuseExistingChunk: true } } } } }