Since we put this output on a load balancer (without using sticky), we need to put the output of these files without chunks (without hashes).
These are the two main files for configuring webpack.
webpack.common.js
const path = require('path'); const webpack = require('webpack'); const HtmlWebpackPlugin = require('html-webpack-plugin'); const ExtractTextPlugin = require('extract-text-webpack-plugin'); const helpers = require('./helpers'); const STATIC_TRANSLATION_MAP = require('../TranslationMap.json'); module.exports = { entry: { app: ['./src/public/main.ts'], vendor: './src/public/vendor.ts', polyfills: './src/public/polyfills.ts' }, output: { path: helpers.root('dist/public') }, module: { rules: [ { test: /\.ts$/, loaders: ['awesome-typescript-loader', 'angular2-template-loader', 'angular2-router-loader'] }, { test: /\.html$/, loader: 'html-loader?-minimize' }, { test: /\.(png|jpe?g|gif|svg|woff|woff2|ttf|eot|ico)$/, loader: 'file-loader?name=assets/[name].[ext]' }, { test: /\.styl$/, include: helpers.root('src', 'public', 'app'), use: [ 'raw-loader', 'stylus-loader' ] }, { test: /\.styl$/, include: helpers.root('src', 'public'), exclude: helpers.root('src', 'public', 'app'), use: ExtractTextPlugin.extract({ fallback: 'style-loader', use: [ 'css-loader', 'stylus-loader' ] }) }, { test: /\.css$/, include: helpers.root('src', 'public', 'assets', 'css'), loader: 'raw-loader' }, { test: /\.xlf$/, loader: 'raw-loader' } ] }, resolve: { extensions: ['.webpack.js', '.web.js', '.ts', '.js'], alias: {} }, plugins: [ new webpack.optimize.CommonsChunkPlugin({ name: ['app', 'vendor', 'polyfills'] }), new HtmlWebpackPlugin({ template: 'src/public/index.html' }), new webpack.DefinePlugin({ 'process.env': { 'LOCALE_LIST': JSON.stringify(Object.keys(STATIC_TRANSLATION_MAP)) } }) ] };
webpack.prod.js
const webpack = require('webpack'); const webpackMerge = require('webpack-merge'); const ExtractTextPlugin = require('extract-text-webpack-plugin'); const commonConfig = require('./webpack.common.js'); const helpers = require('./helpers'); const prodEnv = 'production'; module.exports = webpackMerge(commonConfig, { devtool: 'source-map', output: { filename: '[name].js', chunkFilename: '[name].js' }, plugins: [ new webpack.NoEmitOnErrorsPlugin(), new webpack.optimize.UglifyJsPlugin({ mangle: { keep_fnames: true } }), new webpack.LoaderOptionsPlugin({ htmlLoader: { minimize: false } }), new ExtractTextPlugin('[name].css'), new webpack.DefinePlugin({ 'process.env': { 'ENV': JSON.stringify(prodEnv) } }) ] });
But, to my surprise, I noticed that webpack creates additional files. Can you see these numbers? (0 to 19). I'm not sure where they come from, and each of their contents starts with webpackJsonp .
Is there a way to disable this chunk function and just create three files from entry ?
