Merge pull request #2014 from weaveworks/1941-consolidate-webpack

Combined external and prod webpack config files

Makefile

@@ -154,7 +154,7 @@ client/build-external/index.html:
 
 endif
 
-$(SCOPE_UI_BUILD_UPTODATE): client/Dockerfile client/package.json client/webpack.local.config.js client/webpack.production.config.js client/webpack.external.config.js client/server.js client/.eslintrc
+$(SCOPE_UI_BUILD_UPTODATE): client/Dockerfile client/package.json client/webpack.local.config.js client/webpack.production.config.js client/server.js client/.eslintrc
 	$(SUDO) docker build -t $(SCOPE_UI_BUILD_IMAGE) client
 	touch $@
 

client/Dockerfile

@@ -3,4 +3,4 @@ WORKDIR /home/weave
 COPY package.json /home/weave/
 ENV NPM_CONFIG_LOGLEVEL=warn NPM_CONFIG_PROGRESS=false
 RUN npm install
-COPY webpack.local.config.js webpack.production.config.js webpack.external.config.js server.js .babelrc .eslintrc .eslintignore /home/weave/
+COPY webpack.local.config.js webpack.production.config.js server.js .babelrc .eslintrc .eslintignore /home/weave/

client/package.json

@@ -78,7 +78,7 @@
   },
   "scripts": {
     "build": "webpack --config webpack.production.config.js",
-    "build-external": "webpack --config webpack.external.config.js",
+    "build-external": "EXTERNAL=true webpack --config webpack.production.config.js",
     "start": "node server.js",
     "start-production": "NODE_ENV=production node server.js",
     "test": "jest",

client/webpack.external.config.js

@@ -1,121 +0,0 @@
-const webpack = require('webpack');
-const autoprefixer = require('autoprefixer');
-const path = require('path');
-
-const CleanWebpackPlugin = require('clean-webpack-plugin');
-const ExtractTextPlugin = require('extract-text-webpack-plugin');
-const HtmlWebpackPlugin = require('html-webpack-plugin');
-
-const GLOBALS = {
-  'process.env': {NODE_ENV: '"production"'}
-};
-
-/**
- * This is the Webpack configuration file for hosting most of the static content
- * (all but index.htm) on an external host (eg. a CDN).
- * You should change output.publicPath to point to your external host.
- */
-module.exports = {
-
-  // fail on first error when building release
-  bail: true,
-
-  cache: {},
-
-  entry: {
-    app: './app/scripts/main',
-    'contrast-app': './app/scripts/contrast-main',
-    'terminal-app': './app/scripts/terminal-main',
-    // keep only some in here, to make vendors and app bundles roughly same size
-    vendors: ['babel-polyfill', 'classnames', 'd3', 'immutable',
-      'lodash', 'react', 'react-dom', 'react-redux',
-      'redux', 'redux-thunk']
-  },
-
-  output: {
-    path: path.join(__dirname, 'build-external/'),
-    filename: '[name]-[chunkhash].js',
-    // Change this line to point to resources on an external host.
-    publicPath: 'https://s3.amazonaws.com/static.weave.works/scope-ui/'
-  },
-
-  module: {
-    include: [
-      path.resolve(__dirname, 'app/scripts')
-    ],
-    preLoaders: [
-      {
-        test: /\.js$/,
-        exclude: /node_modules|vendor/,
-        loader: 'eslint-loader'
-      }
-    ],
-    loaders: [
-      {
-        test: /\.less$/,
-        loader: ExtractTextPlugin.extract('style-loader',
-          'css-loader?minimize!postcss-loader!less-loader')
-      },
-      {
-        test: /\.woff(2)?(\?v=[0-9]\.[0-9]\.[0-9])?$/,
-        loader: 'url-loader?limit=10000&minetype=application/font-woff'
-      },
-      {
-        test: /\.(ttf|eot|svg|ico)(\?v=[0-9]\.[0-9]\.[0-9])?$/,
-        loader: 'file-loader'
-      },
-      {
-        test: /\.ico$/,
-        loader: 'file-loader?name=[name].[ext]'
-      },
-      { test: /\.jsx?$/, exclude: /node_modules|vendor/, loader: 'babel' }
-    ]
-  },
-
-  postcss: [
-    autoprefixer({
-      browsers: ['last 2 versions']
-    })
-  ],
-
-  eslint: {
-    failOnError: true
-  },
-
-  resolve: {
-    extensions: ['', '.js', '.jsx']
-  },
-
-  plugins: [
-    new CleanWebpackPlugin(['build']),
-    new webpack.DefinePlugin(GLOBALS),
-    new webpack.optimize.CommonsChunkPlugin('vendors', 'vendors-[chunkhash].js'),
-    new webpack.optimize.OccurenceOrderPlugin(true),
-    new webpack.IgnorePlugin(/^\.\/locale$/, [/moment$/]),
-    new webpack.optimize.UglifyJsPlugin({
-      sourceMap: false,
-      compress: {
-        warnings: false
-      }
-    }),
-    new ExtractTextPlugin('style-[name]-[chunkhash].css'),
-    new HtmlWebpackPlugin({
-      hash: true,
-      chunks: ['vendors', 'contrast-app'],
-      template: 'app/html/index.html',
-      filename: 'contrast.html'
-    }),
-    new HtmlWebpackPlugin({
-      hash: true,
-      chunks: ['vendors', 'terminal-app'],
-      template: 'app/html/index.html',
-      filename: 'terminal.html'
-    }),
-    new HtmlWebpackPlugin({
-      hash: true,
-      chunks: ['vendors', 'app'],
-      template: 'app/html/index.html',
-      filename: 'index.html'
-    })
-  ]
-};

client/webpack.production.config.js

@@ -10,6 +10,15 @@ const GLOBALS = {
   'process.env': {NODE_ENV: '"production"'}
 };
 
+let OUTPUT_PATH = 'build/';
+let PUBLIC_PATH = '/';
+
+if (process.env.EXTERNAL) {
+  OUTPUT_PATH = 'build-external/';
+  // Change this line to point to resources on an external host.
+  PUBLIC_PATH = 'https://s3.amazonaws.com/static.weave.works/scope-ui/';
+}
+
 /**
  * This is the Webpack configuration file for production.
  */
@@ -31,11 +40,15 @@ module.exports = {
   },
 
   output: {
-    path: path.join(__dirname, 'build/'),
+    path: path.join(__dirname, OUTPUT_PATH),
     filename: '[name]-[chunkhash].js',
+    publicPath: PUBLIC_PATH
   },
 
   module: {
+    // Webpack is opionated about how pkgs should be laid out:
+    // https://github.com/webpack/webpack/issues/1617
+    noParse: /xterm/,
     include: [
       path.resolve(__dirname, 'app/scripts')
     ],