title: Webpack 2 - Suppress chunk files
body: <p>As we are putting this output on a load balancer (not using sticky), we need to place the output of these files without chunks (neither hashes).</p>
  
  <p>These are the main two files for webpack configuration.</p>
  
  <p>webpack.common.js</p>
  
  <pre><code>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))
              }
          })
      ]
  };
  </code></pre>
  
  <p>webpack.prod.js</p>
  
  <pre><code>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)
              }
          })
      ]
  });
  </code></pre>
  
  <p>But for my surprise, I noticed webpack is producing extra files. Can you see those ones with numbers? (From 0 to 19). I'm not sure from where they're coming from, and every content of those starts with <code>webpackJsonp</code>.</p>
  
  <p>Is there a way to disable this chunk feature and just produce the three files from <code>entry</code>?</p>
  
  <p><a href="https://i.stack.imgur.com/o555S.png" rel="nofollow noreferrer"><img src="https://i.stack.imgur.com/o555S.png" alt="enter image description here"></a></p>