feat(build): Use webpack instead of requirejs

Why? Because webpack in the content server cannot
find fxa-js-client's es6-promise when built
using requirejs.

packages/fxa-js-client/Gruntfile.js

@@ -20,7 +20,7 @@ module.exports = function (grunt) {
 
   grunt.registerTask('build',
     'Build client',
-    ['clean', 'lint', 'requirejs', 'bytesize']);
+    ['clean', 'lint', 'webpack:app', 'bytesize']);
 
   grunt.registerTask('test',
     'Run tests via node',

packages/fxa-js-client/bower.json

@@ -1,10 +1,6 @@
 {
   "name": "fxa-js-client",
   "devDependencies": {
-    "requirejs": "2.1.6",
-    "requirejs-plugins": "1.0.2",
-    "requirejs-handlebars": "0.0.1",
-    "almond": "0.2.5",
     "cjs": "https://github.com/guybedford/cjs.git#69c7f33059"
   },
   "dependencies": {

packages/fxa-js-client/config/end.frag

@@ -1,6 +0,0 @@
-    //The modules for your project will be inlined above
-    //this snippet. Ask almond to synchronously require the
-    //module value for 'main' here and return it as the
-    //value to use for the public API for the built file.
-    return requirejs('client/FxAccountClient');
-}));

packages/fxa-js-client/config/start.frag

@@ -1,14 +0,0 @@
-// Details: https://github.com/jrburke/almond#exporting-a-public-api
-(function (root, factory) {
-    if (typeof define === 'function' && define.amd) {
-        //Allow using this built library as an AMD module
-        //in another project. That other project will only
-        //see this AMD call, not the internal modules in
-        //the closure below.
-        define([], factory);
-    } else {
-        //Browser globals case. Just assign the
-        //result to a property on the global.
-        root.FxAccountClient = factory();
-    }
-}(this, function () {

packages/fxa-js-client/package.json

@@ -37,23 +37,24 @@
   "devDependencies": {
     "bower": "1.4.1",
     "eslint-config-fxa": "1.8.1",
-    "grunt": "~0.4.2",
+    "grunt": "0.4.2",
     "grunt-build-control": "git://github.com/robwierzbowski/grunt-build-control#274952",
     "grunt-bump": "0.3.1",
-    "grunt-bytesize": "~0.1.1",
+    "grunt-bytesize": "0.1.1",
     "grunt-cli": "0.1.13",
     "grunt-contrib-clean": "0.6.0",
-    "grunt-contrib-requirejs": "~0.4.1",
     "grunt-contrib-watch": "0.6.1",
     "grunt-contrib-yuidoc": "0.9.0",
     "grunt-conventional-changelog": "3.0.0",
     "grunt-copyright": "0.2.0",
     "grunt-eslint": "16.0.0",
     "grunt-jscs": "2.0.0",
-    "grunt-open": "~0.2.2",
+    "grunt-open": "0.2.2",
+    "grunt-webpack": "3.0.2",
     "http-proxy": "1.11.1",
     "intern-geezer": "2.2.3",
     "jscs-jsdoc": "1.1.0",
-    "load-grunt-tasks": "3.2.0"
+    "load-grunt-tasks": "3.2.0",
+    "webpack": "3.10.0"
   }
 }

packages/fxa-js-client/tasks/require.js

@@ -1,38 +0,0 @@
-/* This Source Code Form is subject to the terms of the Mozilla Public
- * License, v. 2.0. If a copy of the MPL was not distributed with this
- * file, You can obtain one at http://mozilla.org/MPL/2.0/. */
-
-module.exports = function (grunt) {
-  'use strict';
-
-  grunt.config('requirejs', {
-    options: {
-      baseUrl: '.',
-      include: ['client/FxAccountClient'],
-      name: 'components/almond/almond',
-      wrap: {
-        startFile: 'config/start.frag',
-        endFile: 'config/end.frag'
-      },
-      paths: {
-        'es6-promise': 'components/es6-promise/dist/es6-promise',
-        sjcl: 'components/sjcl/sjcl'
-      }
-    },
-    prod: {
-      options: {
-        out: 'build/fxa-client.min.js',
-        optimize: 'uglify2',
-        generateSourceMaps: true,
-        preserveLicenseComments: false
-      }
-    },
-    debug: {
-      options: {
-        out: 'build/fxa-client.js',
-        optimize: 'none',
-        preserveLicenseComments: true
-      }
-    }
-  });
-};

packages/fxa-js-client/tasks/watch.js

@@ -18,7 +18,7 @@ module.exports = function (grunt) {
         atBegin: true
       },
       files: ['Gruntfile.js', 'client/**/*.js', 'tests/**/*.js'],
-      tasks: ['requirejs:debug', 'intern:node']
+      tasks: ['webpack:app', 'intern:node']
     }
   });
 };

packages/fxa-js-client/tasks/webpack.js

@@ -0,0 +1,16 @@
+/* This Source Code Form is subject to the terms of the Mozilla Public
+ * License, v. 2.0. If a copy of the MPL was not distributed with this
+ * file, You can obtain one at http://mozilla.org/MPL/2.0/. */
+
+module.exports = function (grunt) {
+  const webpackConfig = require('../webpack.config');
+
+  grunt.config('webpack', {
+    options: {
+      stats: true
+    },
+    app: webpackConfig,
+    watch: Object.assign({ watch: true }, webpackConfig)
+  });
+};
+

packages/fxa-js-client/webpack.config.js

@@ -0,0 +1,76 @@
+/* This Source Code Form is subject to the terms of the Mozilla Public
+ * License, v. 2.0. If a copy of the MPL was not distributed with this
+ * file, You can obtain one at http://mozilla.org/MPL/2.0/. */
+
+/* eslint-disable */
+const path = require('path');
+const webpack = require('webpack');
+
+module.exports = {
+  context: path.resolve(__dirname),
+  entry: {
+    'fxa-client': './client/FxAccountClient',
+    'fxa-client.min': './client/FxAccountClient',
+  },
+
+  output: {
+    filename: '[name].js',
+    library: 'FxAccountClient',
+    libraryTarget: 'umd',
+    path: path.resolve(__dirname, 'build'),
+    publicPath: '/'
+  },
+
+  resolve: {
+    extensions: ['.js'],
+    modules: [
+      path.resolve(__dirname, 'client')
+    ],
+    alias: {
+      'es6-promise': path.resolve(__dirname, 'components/es6-promise/dist/es6-promise'),
+      sjcl: path.resolve(__dirname, 'components/sjcl/sjcl')
+    }
+  },
+
+  plugins: [
+    new webpack.optimize.UglifyJsPlugin({
+      include: /\.min\.js$/,
+      output: {
+        comments: false
+      },
+      compress: {
+        unsafe_comps: true,
+        properties: true,
+        keep_fargs: false,
+        pure_getters: true,
+        collapse_vars: true,
+        unsafe: true,
+        warnings: false,
+        screw_ie8: true,
+        sequences: true,
+        dead_code: true,
+        drop_debugger: true,
+        comparisons: true,
+        conditionals: true,
+        evaluate: true,
+        booleans: true,
+        loops: true,
+        unused: true,
+        hoist_funs: true,
+        if_return: true,
+        join_vars: true,
+        cascade: true,
+        drop_console: true
+      },
+      sourceMap: true
+    })
+  ],
+
+  module: {},
+  stats: { colors: true },
+
+  // See https://webpack.js.org/configuration/devtool/ to
+  // configure source maps to personal preferences.
+  devtool: 'source-map'
+};
+/* eslint-enable */