Refactor build routine and switch to airbnb style (#1703)

- Relocate webpack stuff to assets/build
- Switch all js to airbnb code style
- Update webpack to v2.0 (beta)
- Update all other dependencies
- Assets manifest uses relative path as key [1]
- Code should be compatible with Node 4.5.0
- All dependencies have been updated

[1]: Previously the assets manifest would use the basename of a file path as
its key when looking up a cachebusted file. This was to be consistent with
Sage 8. This change makes it so that the relative path is used instead.

To clarify, review the following example.

Before:
```
{
  "main.js": "scripts/main_5f4bfc9a9f82291c6dea.js",
  "main.css": "styles/main_5f4bfc9a9f82291c6dea.css",
  "customizer.js": "scripts/customizer_5f4bfc9a9f82291c6dea.js"
}
```

After:
```
{
  "scripts/main.js":"scripts/main_5f4bfc9a9f82291c6dea.js",
  "styles/main.css":"styles/main_5f4bfc9a9f82291c6dea.css",
  "scripts/customizer.js":"scripts/customizer_5f4bfc9a9f82291c6dea.js"
}
```

assets/build/webpack.config.js

@@ -0,0 +1,200 @@
+/* eslint-disable import/no-extraneous-dependencies */
+const webpack = require('webpack');
+const path = require('path');
+const qs = require('qs');
+const autoprefixer = require('autoprefixer');
+const CleanPlugin = require('clean-webpack-plugin');
+const ExtractTextPlugin = require('extract-text-webpack-plugin');
+const ImageminPlugin = require('imagemin-webpack-plugin').default;
+const imageminMozjpeg = require('imagemin-mozjpeg');
+
+const mergeWithConcat = require('./util/mergeWithConcat');
+const webpackConfigProduction = require('./webpack.config.production');
+const webpackConfigWatch = require('./webpack.config.watch');
+const config = require('./config');
+
+const publicPath = `${config.publicPath}/${path.basename(config.paths.dist)}/`;
+const assetsFilenames = (config.enabled.cacheBusting) ? config.cacheBusting : '[name]';
+const sourceMapQueryStr = (config.enabled.sourceMaps) ? '+sourceMap' : '-sourceMap';
+
+const jsLoader = {
+  test: /\.js$/,
+  exclude: [/(node_modules|bower_components)(?![/|\\](bootstrap|foundation-sites))/],
+  loaders: [`babel?presets[]=${path.resolve('./node_modules/babel-preset-es2015')}&cacheDirectory`],
+};
+
+if (config.enabled.watcher) {
+  jsLoader.loaders.unshift('monkey-hot');
+}
+
+const webpackConfig = {
+  context: config.paths.assets,
+  entry: config.entry,
+  devtool: (config.enabled.sourceMaps ? '#source-map' : undefined),
+  output: {
+    path: config.paths.dist,
+    publicPath,
+    filename: `scripts/${assetsFilenames}.js`,
+  },
+  module: {
+    preLoaders: [
+      {
+        test: /\.js?$/,
+        include: config.paths.assets,
+        loader: 'eslint',
+      },
+    ],
+    loaders: [
+      jsLoader,
+      {
+        test: /\.css$/,
+        include: config.paths.assets,
+        loader: ExtractTextPlugin.extract({
+          fallbackLoader: 'style',
+          loader: [
+            `css?${sourceMapQueryStr}`,
+            'postcss',
+          ],
+        }),
+      },
+      {
+        test: /\.scss$/,
+        include: config.paths.assets,
+        loader: ExtractTextPlugin.extract({
+          fallbackLoader: 'style',
+          loader: [
+            `css?${sourceMapQueryStr}`,
+            'postcss',
+            `resolve-url?${sourceMapQueryStr}`,
+            `sass?${sourceMapQueryStr}`,
+          ],
+        }),
+      },
+      {
+        test: /\.(png|jpe?g|gif|svg)$/,
+        include: config.paths.assets,
+        loaders: [
+          `file?${qs.stringify({
+            name: '[path][name].[ext]',
+          })}`,
+        ],
+      },
+      {
+        test: /\.(ttf|eot)$/,
+        include: config.paths.assets,
+        loader: `file?${qs.stringify({
+          name: `[path]${assetsFilenames}.[ext]`,
+        })}`,
+      },
+      {
+        test: /\.woff2?$/,
+        include: config.paths.assets,
+        loader: `url?${qs.stringify({
+          limit: 10000,
+          mimetype: 'application/font-woff',
+          name: `[path]${assetsFilenames}.[ext]`,
+        })}`,
+      },
+      {
+        test: /\.(ttf|eot|woff2?|png|jpe?g|gif|svg)$/,
+        include: /node_modules|bower_components/,
+        loader: 'file',
+        query: {
+          name: `vendor/${config.cacheBusting}.[ext]`,
+        },
+      },
+    ],
+  },
+  modules: [
+    config.paths.assets,
+    'node_modules',
+    'bower_components',
+  ],
+  enforceExtensions: false,
+  externals: {
+    jquery: 'jQuery',
+  },
+  plugins: [
+    new CleanPlugin([config.paths.dist], config.paths.root),
+    new ImageminPlugin({
+      optipng: {
+        optimizationLevel: 7,
+      },
+      gifsicle: {
+        optimizationLevel: 3,
+      },
+      pngquant: {
+        quality: '65-90',
+        speed: 4,
+      },
+      svgo: {
+        removeUnknownsAndDefaults: false,
+        cleanupIDs: false,
+      },
+      jpegtran: null,
+      plugins: [imageminMozjpeg({
+        quality: 75,
+      })],
+      disable: (config.enabled.watcher),
+    }),
+    new ExtractTextPlugin({
+      filename: `styles/${assetsFilenames}.css`,
+      allChunks: true,
+      disable: (config.enabled.watcher),
+    }),
+    new webpack.ProvidePlugin({
+      $: 'jquery',
+      jQuery: 'jquery',
+      'window.jQuery': 'jquery',
+      Tether: 'tether',
+      'window.Tether': 'tether',
+    }),
+    new webpack.DefinePlugin({
+      WEBPACK_PUBLIC_PATH: (config.enabled.watcher)
+        ? JSON.stringify(publicPath)
+        : false,
+    }),
+    new webpack.LoaderOptionsPlugin({
+      minimize: config.enabled.minify,
+      debug: config.enabled.watcher,
+      stats: { colors: true },
+      postcss: [
+        autoprefixer({
+          browsers: [
+            'last 2 versions',
+            'android 4',
+            'opera 12',
+          ],
+        }),
+      ],
+      eslint: {
+        failOnWarning: false,
+        failOnError: true,
+      },
+    }),
+  ],
+};
+
+module.exports = webpackConfig;
+
+if (config.env.production) {
+  module.exports = mergeWithConcat(webpackConfig, webpackConfigProduction);
+}
+
+if (config.enabled.watcher) {
+  module.exports = mergeWithConcat(webpackConfig, webpackConfigWatch);
+}
+
+if (config.enabled.uglifyJs) {
+  module.exports.plugins.push(
+    new webpack.optimize.UglifyJsPlugin({
+      compress: config.enabled.minify ? {
+        drop_debugger: true,
+        dead_code: true,
+        warnings: false,
+      } : false,
+      sourceMap: config.enabled.sourceMaps,
+      output: { comments: false },
+    })
+  );
+}