diff --git a/.eslintignore b/.eslintignore
index a72d1b22..e328c937 100644
--- a/.eslintignore
+++ b/.eslintignore
@@ -1 +1,3 @@
 elm-stuff/
+template/
+tests/
diff --git a/.gitignore b/.gitignore
index fc6b3c2a..a2c002a1 100644
--- a/.gitignore
+++ b/.gitignore
@@ -89,8 +89,10 @@ elm-stuff
 repl-temp-*
 
 # create-elm-app
-template/dist
+template/build
 template/package.json
+template/scripts/
+template/config/
 
 # Desktop Services Store on macOS
 .DS_Store
diff --git a/README.md b/README.md
index 8bab9d2e..810e1f96 100644
--- a/README.md
+++ b/README.md
@@ -19,8 +19,14 @@ Create a production build with `elm-app build`
 ## Getting Started
 
 ### Installation
-Node >=4 is required only as a build dependency.
 
+Node >=6 is required as a dependency.
+
+#### Yarn
+
+`yarn global add create-elm-app`
+
+#### NPM
 `npm install create-elm-app -g`
 
 If you are running Linux OS, you should install it as the superuser:
@@ -45,10 +51,11 @@ my-app/
   .gitignore
   README.md
   elm-package.json
-  src/
-    App.elm
+  public/
     favicon.ico
     index.html
+  src/
+    App.elm
     index.js
     main.css
   tests/
@@ -105,12 +112,23 @@ Inspired by [create-react-app](https://github.com/facebookincubator/create-react
 
 * **No Lock-In:** You can “eject” to a custom setup at any time. Run a single command, and all the configuration and build dependencies will be moved directly into your project, so you can pick up right where you left off.
 
+## What is inside
+
+The tools used by Create React App are subject to change.
+Currently it is a thin layer on top of many amazing community projects, such as:
+
+* [elm-platform](https://github.com/elm-lang/elm-platform)
+* [elm-test](https://github.com/elm-community/elm-test)
+* [webpack](https://webpack.js.org/) with [webpack-dev-server](https://github.com/webpack/webpack-dev-server), [html-webpack-plugin](https://github.com/ampedandwired/html-webpack-plugin) and [style-loader](https://github.com/webpack/style-loader)
+* [Babel](http://babeljs.io/) with ES6
+* [Autoprefixer](https://github.com/postcss/autoprefixer)
+* and others.
+
+All of them are transitive dependencies of the provided npm package.
+
 ## Contributing
 We would love to get you involved! Please check our [Contributing Guide](CONTRIBUTING.md) to get started!
 
-## What is inside
-This tool contains a local installation of [elm-platform](https://github.com/elm-lang/elm-platform) and heavily relies on [webpack](https://github.com/webpack/webpack) in the build process.
-
 ## Alternatives
 - [elm-webpack-starter](https://github.com/moarwick/elm-webpack-starter)
 - [elm-app-boilerplate](https://github.com/gkubisa/elm-app-boilerplate)
diff --git a/bin/create-elm-app-cli.js b/bin/create-elm-app-cli.js
index df976cc1..ed4592c3 100755
--- a/bin/create-elm-app-cli.js
+++ b/bin/create-elm-app-cli.js
@@ -1,22 +1,26 @@
 #!/usr/bin/env node
 
-const path = require('path')
-const spawn = require('cross-spawn')
-const argv = require('minimist')(process.argv.slice(2))
-const version = require('../package.json').version
-const elmPlatformVersion = require('elm/package.json').version
-const commands = argv._
+'use strict';
+
+const path = require('path');
+const spawn = require('cross-spawn');
+const argv = require('minimist')(process.argv.slice(2));
+const version = require('../package.json').version;
+const elmPlatformVersion = require('elm/package.json').version;
+const commands = argv._;
 
 if (commands.length === 0) {
-  console.log('\nUsage: create-elm-app <project-directory>\n')
-  console.log('where <project-directory> is the name of the directory with your future project')
-  console.log('\nElm Platform ' + elmPlatformVersion + '\n')
-  console.log('create-elm-app@' + version + ' ' + path.resolve(__dirname, '..'))
-  process.exit(1)
+  console.log('\nUsage: create-elm-app <project-directory>\n');
+  console.log(
+    'where <project-directory> is the name of the directory with your future project'
+  );
+  console.log('\nElm Platform ' + elmPlatformVersion + '\n');
+  console.log(
+    'create-elm-app@' + version + ' ' + path.resolve(__dirname, '..')
+  );
+  process.exit(1);
 }
 
-spawn.sync(
-  'node',
-  [ path.resolve(__dirname, '../scripts/create'), commands ],
-  { stdio: 'inherit' }
-)
+spawn.sync('node', [path.resolve(__dirname, '../scripts/create'), commands], {
+  stdio: 'inherit'
+});
diff --git a/bin/elm-app-cli.js b/bin/elm-app-cli.js
index 7f890776..314f829e 100755
--- a/bin/elm-app-cli.js
+++ b/bin/elm-app-cli.js
@@ -1,22 +1,23 @@
 #!/usr/bin/env node
 
-const path = require('path')
-const spawn = require('cross-spawn')
-const argv = require('minimist')(process.argv.slice(2))
-const executablePaths = require('elm/platform').executablePaths
+'use strict';
 
-const version = require('../package.json').version
-const elmPlatformVersion = require('elm/package.json').version
+const path = require('path');
+const spawn = require('cross-spawn');
+const argv = require('minimist')(process.argv.slice(2));
+const executablePaths = require('elm/platform').executablePaths;
+const version = require('../package.json').version;
+const elmPlatformVersion = require('elm/package.json').version;
 
-const commands = argv._
+const commands = argv._;
 
 if (commands.length === 0) {
-  help(version)
-  process.exit(1)
+  help(version);
+  process.exit(1);
 }
 
-const script = commands[ 0 ]
-const scriptArgs = commands.splice(1)
+const script = commands[0];
+const scriptArgs = commands.splice(1);
 
 switch (script) {
   case 'create':
@@ -24,44 +25,43 @@ switch (script) {
   case 'eject':
   case 'start':
     spawnSyncNode(path.resolve(__dirname, '../scripts', script), scriptArgs);
-    break
+    break;
 
   case 'test': {
-    let args = []
-    Object.keys(argv || {}).forEach(function (key) {
+    let args = [];
+    Object.keys(argv || {}).forEach(key => {
       if (key !== '_' && key !== 'compiler') {
-        args = args.concat([ '--' + key, argv[ key ] ])
+        args = args.concat(['--' + key, argv[key]]);
       }
-    })
+    });
 
-    args = args.concat([ '--compiler', path.normalize(executablePaths[ 'elm-make' ]) ])
+    args = args.concat([
+      '--compiler',
+      path.normalize(executablePaths['elm-make'])
+    ]);
 
-    const cp = spawn.sync(
-      require.resolve('elm-test/bin/elm-test'),
-      args,
-      { stdio: 'inherit' }
-    )
+    const cp = spawn.sync(require.resolve('elm-test/bin/elm-test'), args, {
+      stdio: 'inherit'
+    });
 
     if (cp.status !== 0) {
-      process.exit(cp.status)
+      process.exit(cp.status);
     }
 
-    break
+    break;
   }
   default:
     // Proxy elm-platform cli commands.
-    if ([ 'package', 'reactor', 'make', 'repl' ].indexOf(script) !== -1) {
-      const executable = executablePaths[ 'elm-' + script ]
+    if (['package', 'reactor', 'make', 'repl'].indexOf(script) !== -1) {
+      const executable = executablePaths['elm-' + script];
 
-      spawn.sync(
-        path.normalize(executable),
-        process.argv.slice(3),
-        { stdio: 'inherit' }
-      )
-      break
+      spawn.sync(path.normalize(executable), process.argv.slice(3), {
+        stdio: 'inherit'
+      });
+      break;
     } else {
-      help(version)
-      process.exit(1)
+      help(version);
+      process.exit(1);
     }
 }
 
@@ -71,12 +71,14 @@ switch (script) {
  * @param  {string} version [description]
  * @return {undefined}
  */
-function help (version) {
-  console.log('\nUsage: elm-app <command>\n')
-  console.log('where <command> is one of:')
-  console.log('    create, build, start, package, reactor, make, repl\n')
-  console.log('\nElm ' + elmPlatformVersion + '\n')
-  console.log('create-elm-app@' + version + ' ' + path.resolve(__dirname, '..'))
+function help(version) {
+  console.log('\nUsage: elm-app <command>\n');
+  console.log('where <command> is one of:');
+  console.log('    create, build, start, package, reactor, make, repl\n');
+  console.log('\nElm ' + elmPlatformVersion + '\n');
+  console.log(
+    'create-elm-app@' + version + ' ' + path.resolve(__dirname, '..')
+  );
 }
 
 /**
@@ -86,14 +88,12 @@ function help (version) {
  * @param  {Arrays} args   Script arguments
  * @return {undefined}
  */
-function spawnSyncNode (script, args) {
-  const cp = spawn.sync(
-    'node',
-    [ script ].concat(args || []),
-    { stdio: 'inherit' }
-  )
+function spawnSyncNode(script, args) {
+  const cp = spawn.sync('node', [script].concat(args || []), {
+    stdio: 'inherit'
+  });
 
   if (cp.status !== 0) {
-    process.exit(cp.status)
+    process.exit(cp.status);
   }
 }
diff --git a/config/env.js b/config/env.js
index 6827ce27..83f2be82 100644
--- a/config/env.js
+++ b/config/env.js
@@ -1,10 +1,10 @@
-function getClientEnvironment () {
-  return Object
-    .keys(process.env)
-    .reduce((acc, current) => {
-      acc[ `process.env.${current}` ] = `"${process.env[ current ]}"`
-      return acc
-    }, {})
+'use strict';
+
+function getClientEnvironment() {
+  return Object.keys(process.env).reduce((acc, current) => {
+    acc[`process.env.${current}`] = `"${process.env[current]}"`;
+    return acc;
+  }, {});
 }
 
-module.exports = getClientEnvironment
+module.exports = getClientEnvironment;
diff --git a/config/paths.js b/config/paths.js
index d71a0ab3..4a7aeeb3 100644
--- a/config/paths.js
+++ b/config/paths.js
@@ -1,16 +1,52 @@
-const path = require('path')
+'use strict';
 
-const appRoot = process.cwd()
+const path = require('path');
+const fs = require('fs');
+const url = require('url');
 
-let paths = {
-  appRoot,
-  entry: path.resolve('./src/index.js'),
-  dist: path.resolve('./dist'),
-  template: path.resolve('./src/index.html'),
-  favicon: path.resolve('./src/favicon.ico'),
-  elmPkg: path.resolve('elm-package.json'),
-  elmMake: require('elm/platform').executablePaths['elm-make'],
-  servedPath: './' || process.env.SERVED_PATH
+// Make sure any symlinks in the project folder are resolved:
+// https://github.com/facebookincubator/create-react-app/issues/637
+const appDirectory = fs.realpathSync(process.cwd());
+const resolveApp = relativePath => path.resolve(appDirectory, relativePath);
+
+const envPublicUrl = process.env.PUBLIC_URL;
+
+function ensureSlash(path, needsSlash) {
+  const hasSlash = path.endsWith('/');
+  if (hasSlash && !needsSlash) {
+    return path.substr(path, path.length - 1);
+  } else if (!hasSlash && needsSlash) {
+    return `${path}/`;
+  }
+  return path;
 }
 
-module.exports = paths
+const getPublicUrl = appPackageJson =>
+  envPublicUrl || require(appPackageJson).homepage;
+
+// We use `PUBLIC_URL` environment variable or "homepage" field to infer
+// "public path" at which the app is served.
+// Webpack needs to know it to put the right <script> hrefs into HTML even in
+// single-page apps that may serve index.html for nested URLs like /todos/42.
+// We can't use a relative path in HTML because we don't want to load something
+// like /todos/42/static/js/bundle.7289d.js. We have to know the root.
+function getServedPath(appPackageJson) {
+  const publicUrl = getPublicUrl(appPackageJson);
+  const servedUrl =
+    envPublicUrl || (publicUrl ? url.parse(publicUrl).pathname : '/');
+  return ensureSlash(servedUrl, true);
+}
+
+module.exports = {
+  appPath: resolveApp('.'),
+  appPublic: resolveApp('./public'),
+  appHtml: resolveApp('./public/index.html'),
+  appIndexJs: resolveApp('./src/index.js'),
+  appSrc: resolveApp('./src'),
+  entry: resolveApp('./src/index.js'),
+  appBuild: resolveApp('./build'),
+  elmPackageJson: resolveApp('./elm-package.json'),
+  elmMake: require('elm/platform').executablePaths['elm-make'],
+  publicUrl: getPublicUrl(resolveApp('elm-package.json')),
+  servedPath: getServedPath(resolveApp('elm-package.json'))
+};
diff --git a/config/webpack.config.dev.js b/config/webpack.config.dev.js
index 8bfc18ac..9fc060fc 100644
--- a/config/webpack.config.dev.js
+++ b/config/webpack.config.dev.js
@@ -1,19 +1,21 @@
-const autoprefixer = require('autoprefixer')
-const HotModuleReplacementPlugin = require('webpack/lib/HotModuleReplacementPlugin')
-const DefinePlugin = require('webpack/lib/DefinePlugin')
-const NamedModulesPlugin = require('webpack/lib/NamedModulesPlugin')
-const InterpolateHtmlPlugin = require('react-dev-utils/InterpolateHtmlPlugin')
-const HtmlWebpackPlugin = require('html-webpack-plugin')
-const getClientEnvironment = require('./env')
-const configPaths = require('../config/paths')
+'use strict';
+
+const autoprefixer = require('autoprefixer');
+const HotModuleReplacementPlugin = require('webpack/lib/HotModuleReplacementPlugin');
+const DefinePlugin = require('webpack/lib/DefinePlugin');
+const NamedModulesPlugin = require('webpack/lib/NamedModulesPlugin');
+const InterpolateHtmlPlugin = require('react-dev-utils/InterpolateHtmlPlugin');
+const HtmlWebpackPlugin = require('html-webpack-plugin');
+const getClientEnvironment = require('./env');
+const paths = require('../config/paths');
 
 // Webpack uses `publicPath` to determine where the app is being served from.
 // In development, we always serve from the root. This makes config easier.
-const publicPath = '/'
+const publicPath = '/';
 // `publicUrl` is just like `publicPath`, but we will provide it to our app
 // as %PUBLIC_URL% in `index.html` and `process.env.PUBLIC_URL` in JavaScript.
 // Omit trailing slash as %PUBLIC_PATH%/xyz looks better than %PUBLIC_PATH%xyz.
-const publicUrl = ''
+const publicUrl = '';
 
 module.exports = {
   devtool: 'eval',
@@ -25,17 +27,19 @@ module.exports = {
     // Replacement runtime.
     require.resolve('webpack/hot/dev-server'),
 
-    configPaths.entry
+    paths.appIndexJs
   ],
 
   output: {
     pathinfo: true,
 
     // The build folder.
-    path: configPaths.dist,
+    path: paths.appBuild,
 
-    // Generated JS files.
-    filename: 'dist/js/bundle.js',
+    // This does not produce a real file. It's just the virtual path that is
+    // served by WebpackDevServer in development. This is the JS bundle
+    // containing code from all our entry points, and the Webpack runtime.
+    filename: 'static/js/bundle.js',
 
     publicPath: publicPath
   },
@@ -49,7 +53,6 @@ module.exports = {
     noParse: /\.elm$/,
 
     rules: [
-
       {
         test: /\.js$/,
         exclude: [/elm-stuff/, /node_modules/],
@@ -76,21 +79,27 @@ module.exports = {
               verbose: true,
               warn: true,
               debug: true,
-              pathToMake: configPaths.elmMake,
+              pathToMake: paths.elmMake,
               forceWatch: true
             }
           }
         ]
       },
 
+      // "postcss" loader applies autoprefixer to our CSS.
+      // "css" loader resolves paths in CSS and adds assets as dependencies.
+      // "style" loader turns CSS into JS modules that inject <style> tags.
+      // In production, we use a plugin to extract that CSS to a file, but
+      // in development "style" loader enables hot editing of CSS.
       {
         test: /\.css$/,
         use: [
+          require.resolve('style-loader'),
           {
-            loader: require.resolve('style-loader')
-          },
-          {
-            loader: require.resolve('css-loader')
+            loader: require.resolve('css-loader'),
+            options: {
+              importLoaders: 1
+            }
           },
           {
             loader: require.resolve('postcss-loader'),
@@ -137,15 +146,13 @@ module.exports = {
     new InterpolateHtmlPlugin({
       PUBLIC_URL: publicUrl
     }),
-
     new HtmlWebpackPlugin({
       inject: true,
-      template: configPaths.template,
-      favicon: configPaths.favicon
+      template: paths.appHtml
     }),
 
     new HotModuleReplacementPlugin(),
 
     new NamedModulesPlugin()
   ]
-}
+};
diff --git a/config/webpack.config.prod.js b/config/webpack.config.prod.js
index 2652ea8b..c1e1f82f 100644
--- a/config/webpack.config.prod.js
+++ b/config/webpack.config.prod.js
@@ -1,36 +1,56 @@
-const autoprefixer = require('autoprefixer')
-const DefinePlugin = require('webpack/lib/DefinePlugin')
-const UglifyJsPlugin = require('webpack/lib/optimize/UglifyJsPlugin')
-const HtmlWebpackPlugin = require('html-webpack-plugin')
-const ExtractTextPlugin = require('extract-text-webpack-plugin')
-const CleanWebpackPlugin = require('clean-webpack-plugin')
-const AssetsPlugin = require('assets-webpack-plugin')
-const InterpolateHtmlPlugin = require('react-dev-utils/InterpolateHtmlPlugin')
-const getClientEnvironment = require('./env')
-const configPaths = require('../config/paths')
+'use strict';
+
+const autoprefixer = require('autoprefixer');
+const DefinePlugin = require('webpack/lib/DefinePlugin');
+const UglifyJsPlugin = require('webpack/lib/optimize/UglifyJsPlugin');
+const HtmlWebpackPlugin = require('html-webpack-plugin');
+const ExtractTextPlugin = require('extract-text-webpack-plugin');
+const AssetsPlugin = require('assets-webpack-plugin');
+const InterpolateHtmlPlugin = require('react-dev-utils/InterpolateHtmlPlugin');
+const getClientEnvironment = require('./env');
+const paths = require('../config/paths');
 
 // Webpack uses `publicPath` to determine where the app is being served from.
 // It requires a trailing slash, or the file assets will get an incorrect path.
-const publicPath = configPaths.servedPath
+const publicPath = paths.servedPath;
+// Some apps do not use client-side routing with pushState.
+// For these, "homepage" can be set to "." to enable relative asset paths.
+const shouldUseRelativeAssetPaths = publicPath === './';
 // `publicUrl` is just like `publicPath`, but we will provide it to our app
 // as %PUBLIC_URL% in `index.html` and `process.env.PUBLIC_URL` in JavaScript.
 // Omit trailing slash as %PUBLIC_URL%/xyz looks better than %PUBLIC_URL%xyz.
-const publicUrl = publicPath.slice(0, -1)
+const publicUrl = publicPath.slice(0, -1);
+
+// Note: defined here because it will be used more than once.
+const cssFilename = 'static/css/[name].[contenthash:8].css';
+
+// ExtractTextPlugin expects the build output to be flat.
+// (See https://github.com/webpack-contrib/extract-text-webpack-plugin/issues/27)
+// However, our output is structured with css, js and media folders.
+// To have this structure working with relative paths, we have to use custom options.
+const extractTextPluginOptions = shouldUseRelativeAssetPaths
+  ? // Making sure that the publicPath goes back to to build folder.
+    { publicPath: Array(cssFilename.split('/').length).join('../') }
+  : {};
 
 module.exports = {
+  // Don't attempt to continue if there are any errors.
   bail: true,
 
-  entry: [configPaths.entry],
+  entry: [paths.appIndexJs],
 
   output: {
     // The build folder.
-    path: configPaths.dist,
+    path: paths.appBuild,
 
     // Append leading slash when production assets are referenced in the html.
     publicPath: publicPath,
 
+    // Add /* filename */ comments to generated require()s in the output.
+    pathinfo: true,
+
     // Generated JS files.
-    filename: 'js/[name].[chunkhash:8].js'
+    filename: 'static/js/[name].[chunkhash:8].js'
   },
 
   resolve: {
@@ -42,7 +62,6 @@ module.exports = {
     noParse: /\.elm$/,
 
     rules: [
-
       {
         test: /\.js$/,
         exclude: [/elm-stuff/, /node_modules/],
@@ -63,39 +82,44 @@ module.exports = {
         // Use the local installation of elm-make
         loader: require.resolve('elm-webpack-loader'),
         options: {
-          pathToMake: configPaths.elmMake
+          pathToMake: paths.elmMake
         }
       },
 
       {
         test: /\.css$/,
-        use: ExtractTextPlugin.extract({
-          fallback: require.resolve('style-loader'),
-          use: [
-            {
-              loader: require.resolve('css-loader'),
-              options: {
-                minimize: true
-              }
-            },
+        use: ExtractTextPlugin.extract(
+          Object.assign(
             {
-              loader: require.resolve('postcss-loader'),
-              options: {
-                ident: 'postcss', // https://webpack.js.org/guides/migrating/#complex-options
-                plugins: () => [
-                  autoprefixer({
-                    browsers: [
-                      '>1%',
-                      'last 4 versions',
-                      'Firefox ESR',
-                      'not ie < 9'
+              fallback: require.resolve('style-loader'),
+              use: [
+                {
+                  loader: require.resolve('css-loader'),
+                  options: {
+                    minimize: true
+                  }
+                },
+                {
+                  loader: require.resolve('postcss-loader'),
+                  options: {
+                    ident: 'postcss', // https://webpack.js.org/guides/migrating/#complex-options
+                    plugins: () => [
+                      autoprefixer({
+                        browsers: [
+                          '>1%',
+                          'last 4 versions',
+                          'Firefox ESR',
+                          'not ie < 9'
+                        ]
+                      })
                     ]
-                  })
-                ]
-              }
-            }
-          ]
-        })
+                  }
+                }
+              ]
+            },
+            extractTextPluginOptions
+          )
+        )
       },
 
       {
@@ -118,22 +142,14 @@ module.exports = {
   },
 
   plugins: [
-
     new InterpolateHtmlPlugin({
       PUBLIC_URL: publicUrl
     }),
 
-    new AssetsPlugin({path: configPaths.dist}),
+    new AssetsPlugin({ path: paths.appBuild }),
 
     new DefinePlugin(getClientEnvironment()),
 
-    // Remove the content of the ./dist/ folder.
-    new CleanWebpackPlugin(['dist'], {
-      root: configPaths.appRoot,
-      verbose: false,
-      dry: false
-    }),
-
     // Minify the compiled JavaScript.
     new UglifyJsPlugin({
       compress: {
@@ -146,8 +162,7 @@ module.exports = {
 
     new HtmlWebpackPlugin({
       inject: true,
-      template: configPaths.template,
-      favicon: configPaths.favicon,
+      template: paths.appHtml,
       minify: {
         removeComments: true,
         collapseWhitespace: true,
@@ -162,6 +177,9 @@ module.exports = {
       }
     }),
 
-    new ExtractTextPlugin('css/[name].[contenthash:8].css')
+    // Note: this won't work without ExtractTextPlugin.extract(..) in `loaders`.
+    new ExtractTextPlugin({
+      filename: cssFilename
+    })
   ]
-}
+};
diff --git a/config/webpackDevServer.config.js b/config/webpackDevServer.config.js
index f79cbed2..11ba59fe 100644
--- a/config/webpackDevServer.config.js
+++ b/config/webpackDevServer.config.js
@@ -1,11 +1,14 @@
-const errorOverlayMiddleware = require('react-error-overlay/middleware')
-const noopServiceWorkerMiddleware = require('react-dev-utils/noopServiceWorkerMiddleware')
-const config = require('./webpack.config.dev')
+'use strict';
 
-const protocol = process.env.HTTPS === 'true' ? 'https' : 'http'
-const host = process.env.HOST || '0.0.0.0'
+const errorOverlayMiddleware = require('react-error-overlay/middleware');
+const noopServiceWorkerMiddleware = require('react-dev-utils/noopServiceWorkerMiddleware');
+const config = require('./webpack.config.dev');
+const paths = require('./paths');
 
-module.exports = function (proxy, allowedHost) {
+const protocol = process.env.HTTPS === 'true' ? 'https' : 'http';
+const host = process.env.HOST || '0.0.0.0';
+
+module.exports = function(proxy, allowedHost) {
   return {
     // WebpackDevServer 2.4.3 introduced a security fix that prevents remote
     // websites from potentially accessing local content through DNS rebinding:
@@ -23,13 +26,30 @@ module.exports = function (proxy, allowedHost) {
     // So we will disable the host check normally, but enable it if you have
     // specified the `proxy` setting. Finally, we let you override it if you
     // really know what you're doing with a special environment variable.
-    disableHostCheck: !proxy ||
-    process.env.DANGEROUSLY_DISABLE_HOST_CHECK === 'true',
+    disableHostCheck:
+      !proxy || process.env.DANGEROUSLY_DISABLE_HOST_CHECK === 'true',
     // Enable gzip compression of generated files.
     compress: true,
     // Silence WebpackDevServer's own logs since they're generally not useful.
     // It will still show compile warnings and errors with this setting.
     clientLogLevel: 'none',
+    // By default WebpackDevServer serves physical files from current directory
+    // in addition to all the virtual build products that it serves from memory.
+    // This is confusing because those files won’t automatically be available in
+    // production build folder unless we copy them. However, copying the whole
+    // project directory is dangerous because we may expose sensitive files.
+    // Instead, we establish a convention that only files in `public` directory
+    // get served. Our build script will copy `public` into the `build` folder.
+    // In `index.html`, you can get URL of `public` folder with %PUBLIC_URL%:
+    // <link rel="shortcut icon" href="%PUBLIC_URL%/favicon.ico">
+    // In JavaScript code, you can access it with `process.env.PUBLIC_URL`.
+    // Note that we only recommend to use `public` folder as an escape hatch
+    // for files like `favicon.ico`, `manifest.json`, and libraries that are
+    // for some reason broken when imported through Webpack. If you just want to
+    // use an image, put it in `src` and `import` it from JavaScript instead.
+    contentBase: paths.appPublic,
+    // By default files from `contentBase` will not trigger a page reload.
+    watchContentBase: true,
     // Enable hot reloading server. It will provide /sockjs-node/ endpoint
     // for the WebpackDevServer client so it can learn when the files were
     // updated. The WebpackDevServer client is included as an entry point
@@ -58,15 +78,15 @@ module.exports = function (proxy, allowedHost) {
     },
     public: allowedHost,
     proxy,
-    setup (app) {
+    setup(app) {
       // This lets us open files from the runtime error overlay.
-      app.use(errorOverlayMiddleware())
+      app.use(errorOverlayMiddleware());
       // This service worker file is effectively a 'no-op' that will reset any
       // previous service worker registered for the same host:port combination.
       // We do this in development to avoid hitting the production cache if
       // it used the same host and port.
       // https://github.com/facebookincubator/create-react-app/issues/2272#issuecomment-302832432
-      app.use(noopServiceWorkerMiddleware())
+      app.use(noopServiceWorkerMiddleware());
     }
-  }
-}
+  };
+};
diff --git a/scripts/build.js b/scripts/build.js
index 918f121e..2cc24e26 100644
--- a/scripts/build.js
+++ b/scripts/build.js
@@ -1,35 +1,109 @@
+'use strict';
+
 // Load environment variables from .env file.
 // Suppress warnings if this file is missing.
-require('dotenv').config({silent: true})
+require('dotenv').config({ silent: true });
+
+const fs = require('fs-extra');
+const chalk = require('chalk');
+const webpack = require('webpack');
+const config = require('../config/webpack.config.prod');
+const paths = require('../config/paths');
+const checkRequiredFiles = require('react-dev-utils/checkRequiredFiles');
+const formatWebpackMessages = require('react-dev-utils/formatWebpackMessages');
+const FileSizeReporter = require('react-dev-utils/FileSizeReporter');
 
-const fs = require('fs')
-const chalk = require('chalk')
-const webpack = require('webpack')
-const config = require('../config/webpack.config.prod')
+const measureFileSizesBeforeBuild =
+  FileSizeReporter.measureFileSizesBeforeBuild;
+const printFileSizesAfterBuild = FileSizeReporter.printFileSizesAfterBuild;
 
 if (fs.existsSync('elm-package.json') === false) {
-  console.log('Please, run the build script from project root directory')
-  process.exit(1)
+  console.log('Please, run the build script from project root directory');
+  process.exit(1);
+}
+
+// Warn and crash if required files are missing
+if (!checkRequiredFiles([paths.appIndexJs, paths.appHtml])) {
+  process.exit(1);
+}
+
+// First, read the current file sizes in build directory.
+// This lets us display how much they changed later.
+measureFileSizesBeforeBuild(paths.appBuild)
+  .then(previousFileSizes => {
+    // Remove all content but keep the directory so that
+    // if you're in it, you don't end up in Trash
+    fs.emptyDirSync(paths.appBuild);
+    // Merge with the public folder
+    copyPublicFolder();
+    // Start the webpack build
+    return build(previousFileSizes);
+  })
+  .then(
+    ({ stats, previousFileSizes, warnings }) => {
+      if (warnings.length) {
+        console.log(chalk.yellow('Compiled with warnings.\n'));
+        console.log(warnings.join('\n\n'));
+        console.log(
+          '\nSearch for the ' +
+            chalk.underline(chalk.yellow('keywords')) +
+            ' to learn more about each warning.'
+        );
+        console.log(
+          'To ignore, add ' +
+            chalk.cyan('// eslint-disable-next-line') +
+            ' to the line before.\n'
+        );
+      } else {
+        console.log(chalk.green('Compiled successfully.\n'));
+      }
+
+      console.log('File sizes after gzip:\n');
+      printFileSizesAfterBuild(stats, previousFileSizes, paths.appBuild);
+      console.log();
+    },
+    err => {
+      console.log(chalk.red('Failed to compile.\n'));
+      console.log((err.message || err) + '\n');
+      process.exit(1);
+    }
+  );
+
+// Create the production build and print the deployment instructions.
+function build(previousFileSizes) {
+  console.log('Creating an optimized production build...');
+
+  const compiler = webpack(config);
+  return new Promise((resolve, reject) => {
+    compiler.run((err, stats) => {
+      if (err) {
+        return reject(err);
+      }
+      const messages = formatWebpackMessages(stats.toJson({}, true));
+      if (messages.errors.length) {
+        return reject(new Error(messages.errors.join('\n\n')));
+      }
+      if (process.env.CI && messages.warnings.length) {
+        console.log(
+          chalk.yellow(
+            '\nTreating warnings as errors because process.env.CI = true.\n' +
+              'Most CI servers set it automatically.\n'
+          )
+        );
+        return reject(new Error(messages.warnings.join('\n\n')));
+      }
+      return resolve({
+        stats,
+        previousFileSizes,
+        warnings: messages.warnings
+      });
+    });
+  });
 }
 
-console.log('\nStarting production build...\n')
-
-// Initialize webpack, using the long way: http://webpack.github.io/docs/node.js-api.html#the-long-way
-webpack(config).run((err, stats) => { // eslint-disable-line handle-callback-err
-  if (stats.compilation.errors.length > 0) {
-    console.log(stats.toString({
-      chunks: false,
-      colors: true,
-      assets: false
-    }))
-    process.exit(1)
-  } else {
-    const statsFormatted = stats.toString({
-      chunks: false,
-      colors: true
-    })
-
-    console.log(statsFormatted)
-    console.log(chalk.green('\n' + 'Production build is ready in `dist/` folder'))
-  }
-})
+function copyPublicFolder() {
+  fs.copySync(paths.appPublic, paths.appBuild, {
+    dereference: true,
+    filter: file => file !== paths.appHtml
+  });
+}
diff --git a/scripts/create.js b/scripts/create.js
index e63cc1d6..28891763 100644
--- a/scripts/create.js
+++ b/scripts/create.js
@@ -1,73 +1,88 @@
-const fs = require('fs')
-const copySync = require('fs-extra').copySync
-const path = require('path')
-const chalk = require('chalk')
-const spawnSync = require('child_process').spawnSync
-const argv = require('minimist')(process.argv.slice(2))
-const commands = argv._
-const executablePaths = require('elm/platform').executablePaths
+'use strict';
 
-if (commands.length === 0 || commands[ 0 ] === '') {
-  console.error(
-    '\nUsage: elm-app create <project-directory>'
-  )
-  process.exit(1)
+const fs = require('fs');
+const copySync = require('fs-extra').copySync;
+const path = require('path');
+const chalk = require('chalk');
+const spawnSync = require('child_process').spawnSync;
+const argv = require('minimist')(process.argv.slice(2));
+const commands = argv._;
+const executablePaths = require('elm/platform').executablePaths;
+
+if (commands.length === 0 || commands[0] === '') {
+  console.error('\nUsage: elm-app create <project-directory>');
+  process.exit(1);
 }
 
-createElmApp(commands[ 0 ])
+createElmApp(commands[0]);
 
-function createElmApp (name) {
-  console.log('\nCreating ' + name + ' project...\n')
+function createElmApp(name) {
+  console.log('\nCreating ' + name + ' project...\n');
 
-  const root = path.resolve(name)
-  const template = path.join(__dirname, '../template')
+  const root = path.resolve(name);
+  const template = path.join(__dirname, '../template');
 
   if (!fs.existsSync(name)) {
     try {
-      copySync(template, root)
-      fs.renameSync(path.resolve(root, 'gitignore'), path.resolve(root, '.gitignore'))
+      copySync(template, root);
+      fs.renameSync(
+        path.resolve(root, 'gitignore'),
+        path.resolve(root, '.gitignore')
+      );
     } catch (err) {
-      console.log(err)
-      process.exit(1)
+      console.log(err);
+      process.exit(1);
     }
   } else {
-    console.log('The directory ' + name + ' already exists. Aborting.')
-    process.exit(1)
+    console.log('The directory ' + name + ' already exists. Aborting.');
+    process.exit(1);
   }
 
-  process.chdir(root)
+  process.chdir(root);
 
   // Run initial `elm-package install -y`
-  const spawnElmPkgResult = spawnSync(executablePaths[ 'elm-package' ], [ 'install', '-y' ], { stdio: 'inherit' })
+  const spawnElmPkgResult = spawnSync(
+    executablePaths['elm-package'],
+    ['install', '-y'],
+    { stdio: 'inherit' }
+  );
 
-  if (spawnElmPkgResult.status === null) {
-    console.log(chalk.red('\nFailed to install elm packages'))
-    console.log('\nPlease, make sure you have internet connection!')
-    console.log('\nIn case if you are running Unix OS, you might look in to this issue:')
-    console.log('\n    https://github.com/halfzebra/create-elm-app/issues/10')
-    process.exit(1)
+  if (spawnElmPkgResult.status !== 0) {
+    console.log(chalk.red('\nFailed to install elm packages'));
+    console.log('\nPlease, make sure you have internet connection!');
+    console.log(
+      '\nIn case if you are running Unix OS, you might look in to this issue:'
+    );
+    console.log('\n    https://github.com/halfzebra/create-elm-app/issues/10');
+    process.exit(1);
   }
 
-  console.log(chalk.green('\nProject is successfully created in `' + root + '`.'))
-  console.log()
-  console.log('Inside that directory, you can run several commands:')
-  console.log()
-  console.log(chalk.cyan('  elm-app start'))
-  console.log('    Starts the development server.')
-  console.log()
-  console.log(chalk.cyan('  elm-app build'))
-  console.log('    Bundles the app into static files for production.')
-  console.log()
-  console.log(chalk.cyan('  elm-app test'))
-  console.log('    Starts the test runner.')
-  console.log()
-  console.log(chalk.cyan('  elm-app eject'))
-  console.log('    Removes this tool and copies build dependencies, configuration files')
-  console.log('    and scripts into the app directory. If you do this, you can’t go back!')
-  console.log()
-  console.log('We suggest that you begin by typing:')
-  console.log()
-  console.log(chalk.cyan('  cd'), name)
-  console.log('  ' + chalk.cyan('elm-app start'))
-  console.log()
+  console.log(
+    chalk.green('\nProject is successfully created in `' + root + '`.')
+  );
+  console.log();
+  console.log('Inside that directory, you can run several commands:');
+  console.log();
+  console.log(chalk.cyan('  elm-app start'));
+  console.log('    Starts the development server.');
+  console.log();
+  console.log(chalk.cyan('  elm-app build'));
+  console.log('    Bundles the app into static files for production.');
+  console.log();
+  console.log(chalk.cyan('  elm-app test'));
+  console.log('    Starts the test runner.');
+  console.log();
+  console.log(chalk.cyan('  elm-app eject'));
+  console.log(
+    '    Removes this tool and copies build dependencies, configuration files'
+  );
+  console.log(
+    '    and scripts into the app directory. If you do this, you can’t go back!'
+  );
+  console.log();
+  console.log('We suggest that you begin by typing:');
+  console.log();
+  console.log(chalk.cyan('  cd'), name);
+  console.log('  ' + chalk.cyan('elm-app start'));
+  console.log();
 }
diff --git a/scripts/eject.js b/scripts/eject.js
index e905d23f..0598768b 100644
--- a/scripts/eject.js
+++ b/scripts/eject.js
@@ -1,103 +1,100 @@
-const path = require('path')
-const spawn = require('cross-spawn')
-const chalk = require('chalk')
-const prompt = require('prompt')
-const fs = require('fs-extra')
-const Table = require('cli-table')
-const pkgOwn = require(path.join(__dirname, '../package.json'))
-
-function extendOmittingProps (deps, deleteProps) {
+'use strict';
+
+const path = require('path');
+const spawn = require('cross-spawn');
+const chalk = require('chalk');
+const prompt = require('prompt');
+const fs = require('fs-extra');
+const Table = require('cli-table');
+const pkgOwn = require(path.join(__dirname, '../package.json'));
+
+function extendOmittingProps(deps, deleteProps) {
   if (typeof deleteProps === 'undefined') {
-    deleteProps = []
+    deleteProps = [];
   }
 
-  deps = Object.assign({}, deps)
+  deps = Object.assign({}, deps);
 
-  deleteProps.forEach(function (name) {
-    delete deps[name]
-  })
+  deleteProps.forEach(name => {
+    delete deps[name];
+  });
 
-  return deps
+  return deps;
 }
 
-function diffTable (target, mixin, head) {
+function diffTable(target, mixin, head) {
   if (typeof head === 'undefined') {
-    head = [chalk.grey('Name'), chalk.yellow('Old'), chalk.green('New')]
+    head = [chalk.grey('Name'), chalk.yellow('Old'), chalk.green('New')];
   }
 
   const table = new Table({
     head: head
-  })
+  });
 
   for (const propName in target) {
     if (propName in mixin) {
-      const targetPropValue = target[propName]
-      const mixinPropValue = mixin[propName]
+      const targetPropValue = target[propName];
+      const mixinPropValue = mixin[propName];
       // If found and is not equal
       if (targetPropValue !== mixinPropValue) {
-        table.push([propName, targetPropValue, mixinPropValue])
+        table.push([propName, targetPropValue, mixinPropValue]);
       }
     }
   }
 
-  return table
+  return table;
 }
 
-function promptYesOrNo () {
+function promptYesOrNo() {
   return new Promise((resolve, reject) => {
     const property = {
       name: 'answer',
       message: chalk.yellow('Would you like to continue? [Y/n]')
-    }
+    };
 
-    prompt.start()
-    prompt.message = ''
+    prompt.start();
+    prompt.message = '';
 
-    prompt.get(property, (err, result) => { // eslint-disable-line handle-callback-err
+    prompt.get(property, (err, result) => {
+      // eslint-disable-line handle-callback-err
       if (result.answer.search(/^y(es)?$/i) !== -1) {
-        resolve()
+        resolve();
       } else {
-        reject('\nAborting...') // eslint-disable-line prefer-promise-reject-errors
+        reject('\nAborting...'); // eslint-disable-line prefer-promise-reject-errors
       }
-    })
-  })
+    });
+  });
 }
 
-function performEject (pkg) {
+function performEject(pkg) {
   // Copy the configuration and start/build scripts.
   try {
-    fs.copySync(path.resolve(__dirname, 'build.js'), './scripts/build.js')
-    fs.copySync(path.resolve(__dirname, 'start.js'), './scripts/start.js')
-    fs.copySync(path.resolve(__dirname, '../config'), './config')
+    fs.copySync(path.resolve(__dirname, 'build.js'), './scripts/build.js');
+    fs.copySync(path.resolve(__dirname, 'start.js'), './scripts/start.js');
+    fs.copySync(path.resolve(__dirname, '../config'), './config');
   } catch (err) {
-    console.log(chalk.red('Failed to copy scripts, the error is:\n'))
-    console.log(err)
-    process.exit(1)
+    console.log(chalk.red('Failed to copy scripts, the error is:\n'));
+    console.log(err);
+    process.exit(1);
   }
 
   // Update or create new package.json
-  fs.writeFileSync('package.json', JSON.stringify(pkg, null, 2))
+  fs.writeFileSync('package.json', JSON.stringify(pkg, null, 2));
 
-  console.log('\nPlease wait for npm to install all required dependencies...')
+  console.log('\nPlease wait for npm to install all required dependencies...');
 
   // Install npm packages
-  spawn.sync(
-    'npm',
-    ['install'],
-    {stdio: 'inherit'}
-  )
+  spawn.sync('npm', ['install'], { stdio: 'inherit' });
 
-  console.log(chalk.green('\nEjected successfully!'))
+  console.log(chalk.green('\nEjected successfully!'));
 }
 
 // The following dependencies will be removed:
-const unusedDependencies = [
-  'cross-spawn',
-  'fs-extra',
-  'cli-table',
-  'prompt'
-]
-const devDependencies = extendOmittingProps(pkgOwn.dependencies, unusedDependencies)
+const unusedDependencies = ['cross-spawn', 'fs-extra', 'cli-table', 'prompt'];
+const devDependencies = extendOmittingProps(
+  pkgOwn.dependencies,
+  unusedDependencies
+);
 const scripts = {
   build: 'node scripts/build.js',
   start: 'node scripts/start.js',
@@ -106,54 +103,67 @@ const scripts = {
   repl: 'elm-repl',
   reactor: 'elm-reactor',
   test: 'elm-test'
-}
+};
 
 if (fs.existsSync('elm-package.json') === false) {
-  console.log('Please, run the eject script from project root directory')
-  process.exit(1)
+  console.log('Please, run the eject script from project root directory');
+  process.exit(1);
 }
 
 if (fs.existsSync('./package.json') === true) {
-  console.log('Found existing package.json')
-  const pkgEjected = JSON.parse(fs.readFileSync('./package.json', {encoding: 'utf-8'}))
+  console.log('Found existing package.json');
+  const pkgEjected = JSON.parse(
+    fs.readFileSync('./package.json', { encoding: 'utf-8' })
+  );
 
   Promise.resolve()
-    .then(function () {
+    .then(() => {
       if (pkgEjected.hasOwnProperty('devDependencies')) {
-        const diff = diffTable(pkgEjected.devDependencies, devDependencies)
+        const diff = diffTable(pkgEjected.devDependencies, devDependencies);
         if (diff.length !== 0) {
-          console.log(diff.toString())
-          console.log('Ejecting wil overwrite your "devDependencies" in package.json\n')
-          return promptYesOrNo()
+          console.log(diff.toString());
+          console.log(
+            'Ejecting wil overwrite your "devDependencies" in package.json\n'
+          );
+          return promptYesOrNo();
         }
       }
     })
-    .then(function () {
-      if (pkgEjected.hasOwnProperty('scripts') && Object.keys(pkgEjected.scripts).length === 0) {
-        const diff = diffTable(pkgEjected.scripts, scripts)
+    .then(() => {
+      if (
+        pkgEjected.hasOwnProperty('scripts') &&
+        Object.keys(pkgEjected.scripts).length === 0
+      ) {
+        const diff = diffTable(pkgEjected.scripts, scripts);
         if (diff.length !== 0) {
-          console.log(diff.toString())
-          console.log('Ejecting will overwrite your "scripts" in package.json\n')
-          return promptYesOrNo()
+          console.log(diff.toString());
+          console.log(
+            'Ejecting will overwrite your "scripts" in package.json\n'
+          );
+          return promptYesOrNo();
         }
       }
     })
-    .then(function () {
-      pkgEjected.devDependencies = Object.assign({}, devDependencies, pkgEjected.devDependencies)
-      pkgEjected.scripts = Object.assign({}, scripts, pkgEjected.scripts)
-      performEject(pkgEjected)
-    })
-    .catch(function (error) {
-      console.log(error)
-      process.exit(1)
+    .then(() => {
+      pkgEjected.devDependencies = Object.assign(
+        {},
+        devDependencies,
+        pkgEjected.devDependencies
+      );
+      pkgEjected.scripts = Object.assign({}, scripts, pkgEjected.scripts);
+      performEject(pkgEjected);
     })
+    .catch(error => {
+      console.log(error);
+      process.exit(1);
+    });
 } else {
-  console.log(chalk.green('New package.json is created for your project'))
+  console.log(chalk.green('New package.json is created for your project'));
   performEject({
     name: path.basename(process.cwd()),
-    version: '0.0.1',
+    version: '1.0.0',
     private: true,
     scripts: scripts,
     devDependencies: devDependencies
-  })
+  });
 }
diff --git a/scripts/start.js b/scripts/start.js
index 8994d0c7..976c27c5 100644
--- a/scripts/start.js
+++ b/scripts/start.js
@@ -1,64 +1,69 @@
+'use strict';
+
 // Load environment variables from .env file.
 // Suppress warnings if this file is missing.
-require('dotenv').config({silent: true})
-
-const fs = require('fs')
-const path = require('path')
-const chalk = require('chalk')
-const webpack = require('webpack')
-const WebpackDevServer = require('webpack-dev-server')
-const config = require('../config/webpack.config.dev')
-const {choosePort, prepareUrls, prepareProxy} = require('react-dev-utils/WebpackDevServerUtils')
-const formatWebpackMessages = require('react-dev-utils/formatWebpackMessages')
-const clearConsole = require('react-dev-utils/clearConsole')
-const openBrowser = require('react-dev-utils/openBrowser')
-const createDevServerConfig = require('../config/webpackDevServer.config')
-const paths = require('../config/paths')
+require('dotenv').config({ silent: true });
+
+const fs = require('fs');
+const path = require('path');
+const chalk = require('chalk');
+const webpack = require('webpack');
+const WebpackDevServer = require('webpack-dev-server');
+const config = require('../config/webpack.config.dev');
+const {
+  choosePort,
+  prepareUrls,
+  prepareProxy
+} = require('react-dev-utils/WebpackDevServerUtils');
+const formatWebpackMessages = require('react-dev-utils/formatWebpackMessages');
+const clearConsole = require('react-dev-utils/clearConsole');
+const openBrowser = require('react-dev-utils/openBrowser');
+const createDevServerConfig = require('../config/webpackDevServer.config');
+const paths = require('../config/paths');
 
 if (fs.existsSync('elm-package.json') === false) {
-  console.log('Please, run the build script from project root directory')
-  process.exit(0)
+  console.log('Please, run the build script from project root directory');
+  process.exit(0);
 }
 
-const isInteractive = process.stdout.isTTY
+const isInteractive = process.stdout.isTTY;
 
-function printInstructions (appName, urls) {
-  console.log()
-  console.log(`You can now view ${chalk.bold(appName)} in the browser.`)
-  console.log()
+function printInstructions(appName, urls) {
+  console.log();
+  console.log(`You can now view ${chalk.bold(appName)} in the browser.`);
+  console.log();
 
   if (urls.lanUrlForTerminal) {
     console.log(
       `  ${chalk.bold('Local:')}            ${urls.localUrlForTerminal}`
-    )
+    );
     console.log(
       `  ${chalk.bold('On Your Network:')}  ${urls.lanUrlForTerminal}`
-    )
+    );
   } else {
-    console.log(`  ${urls.localUrlForTerminal}`)
+    console.log(`  ${urls.localUrlForTerminal}`);
   }
 
-  console.log()
-  console.log('Note that the development build is not optimized.')
+  console.log();
+  console.log('Note that the development build is not optimized.');
   console.log(
-    `To create a production build, use ` +
-    `${chalk.cyan('elm-app build')}.`
-  )
-  console.log()
+    `To create a production build, use ` + `${chalk.cyan('elm-app build')}.`
+  );
+  console.log();
 }
 
-function createCompiler (webpack, config, appName, urls) {
+function createCompiler(webpack, config, appName, urls) {
   // "Compiler" is a low-level interface to Webpack.
   // It lets us listen to some events and provide our own custom messages.
-  let compiler
+  let compiler;
   try {
-    compiler = webpack(config)
+    compiler = webpack(config);
   } catch (err) {
-    console.log(chalk.red('Failed to compile.'))
-    console.log()
-    console.log(err.message || err)
-    console.log()
-    process.exit(1)
+    console.log(chalk.red('Failed to compile.'));
+    console.log();
+    console.log(err.message || err);
+    console.log();
+    process.exit(1);
   }
 
   // "invalid" event fires when you have changed a file, and Webpack is
@@ -67,64 +72,64 @@ function createCompiler (webpack, config, appName, urls) {
   // "invalid" is short for "bundle invalidated", it doesn't imply any errors.
   compiler.plugin('invalid', () => {
     if (isInteractive) {
-      clearConsole()
+      clearConsole();
     }
-    console.log('Compiling...')
-  })
+    console.log('Compiling...');
+  });
 
-  let isFirstCompile = true
+  let isFirstCompile = true;
 
   // "done" event fires when Webpack has finished recompiling the bundle.
   // Whether or not you have warnings or errors, you will get this event.
   compiler.plugin('done', stats => {
     if (isInteractive) {
-      clearConsole()
+      clearConsole();
     }
 
     // We have switched off the default Webpack output in WebpackDevServer
     // options so we are going to "massage" the warnings and errors and present
     // them in a readable focused way.
-    const messages = formatWebpackMessages(stats.toJson({}, true))
-    const isSuccessful = !messages.errors.length && !messages.warnings.length
+    const messages = formatWebpackMessages(stats.toJson({}, true));
+    const isSuccessful = !messages.errors.length && !messages.warnings.length;
     if (isSuccessful) {
-      console.log(chalk.green('Compiled successfully!'))
+      console.log(chalk.green('Compiled successfully!'));
     }
     if (isSuccessful && (isInteractive || isFirstCompile)) {
-      printInstructions(appName, urls)
+      printInstructions(appName, urls);
     }
-    isFirstCompile = false
+    isFirstCompile = false;
 
     // If errors exist, only show errors.
     if (messages.errors.length) {
-      console.log(chalk.red('Failed to compile.\n'))
-      console.log(messages.errors.join('\n\n'))
-      return
+      console.log(chalk.red('Failed to compile.\n'));
+      console.log(messages.errors.join('\n\n'));
+      return;
     }
 
     // Show warnings if no errors were found.
     if (messages.warnings.length) {
-      console.log(chalk.yellow('Compiled with warnings.\n'))
-      console.log(messages.warnings.join('\n\n'))
+      console.log(chalk.yellow('Compiled with warnings.\n'));
+      console.log(messages.warnings.join('\n\n'));
 
       // Teach some ESLint tricks.
       console.log(
         '\nSearch for the ' +
-        chalk.underline(chalk.yellow('keywords')) +
-        ' to learn more about each warning.'
-      )
+          chalk.underline(chalk.yellow('keywords')) +
+          ' to learn more about each warning.'
+      );
       console.log(
         'To ignore, add ' +
-        chalk.cyan('// eslint-disable-next-line') +
-        ' to the line before.\n'
-      )
+          chalk.cyan('// eslint-disable-next-line') +
+          ' to the line before.\n'
+      );
     }
-  })
-  return compiler
+  });
+  return compiler;
 }
 
 // Tools like Cloud9 rely on this.
-const DEFAULT_PORT = parseInt(process.env.PORT, 10) || 3000
-const HOST = process.env.HOST || '0.0.0.0'
+const DEFAULT_PORT = parseInt(process.env.PORT, 10) || 3000;
+const HOST = process.env.HOST || '0.0.0.0';
 
 // We attempt to use the default port but if it is busy, we offer the user to
 // run on a different port. `detect()` Promise resolves to the next free port.
@@ -132,44 +137,44 @@ choosePort(HOST, DEFAULT_PORT)
   .then(port => {
     if (port == null) {
       // We have not found a port.
-      return
+      return;
     }
-    const protocol = process.env.HTTPS === 'true' ? 'https' : 'http'
-    const appName = path.basename(path.dirname(paths.elmPkg))
-    const urls = prepareUrls(protocol, HOST, port)
+    const protocol = process.env.HTTPS === 'true' ? 'https' : 'http';
+    const appName = path.basename(path.dirname(paths.elmPackageJson));
+    const urls = prepareUrls(protocol, HOST, port);
     // Create a webpack compiler that is configured with custom messages.
-    const compiler = createCompiler(webpack, config, appName, urls)
+    const compiler = createCompiler(webpack, config, appName, urls);
     // Load proxy config
-    const proxySetting = require(paths.elmPkg).proxy
-    const proxyConfig = prepareProxy(proxySetting, '/')
+    const proxySetting = require(paths.elmPackageJson).proxy;
+    const proxyConfig = prepareProxy(proxySetting, '/');
     // Serve webpack assets generated by the compiler over a web sever.
     const serverConfig = createDevServerConfig(
       proxyConfig,
       urls.lanUrlForConfig
-    )
-    const devServer = new WebpackDevServer(compiler, serverConfig)
+    );
+    const devServer = new WebpackDevServer(compiler, serverConfig);
     // Launch WebpackDevServer.
     devServer.listen(port, HOST, err => {
       if (err) {
-        return console.log(err)
+        return console.log(err);
       }
       if (isInteractive) {
-        clearConsole()
+        clearConsole();
       }
-      console.log(chalk.cyan('Starting the development server...\n'))
-      openBrowser(urls.localUrlForBrowser)
+      console.log(chalk.cyan('Starting the development server...\n'));
+      openBrowser(urls.localUrlForBrowser);
     });
 
-    ['SIGINT', 'SIGTERM'].forEach(function (sig) {
-      process.on(sig, function () {
-        devServer.close()
-        process.exit()
-      })
-    })
+    ['SIGINT', 'SIGTERM'].forEach(sig => {
+      process.on(sig, () => {
+        devServer.close();
+        process.exit();
+      });
+    });
   })
   .catch(err => {
     if (err && err.message) {
-      console.log(err.message)
+      console.log(err.message);
     }
-    process.exit(1)
-  })
+    process.exit(1);
+  });
diff --git a/template/README.md b/template/README.md
index da8ec250..707c428c 100644
--- a/template/README.md
+++ b/template/README.md
@@ -77,7 +77,7 @@ You may create subdirectories inside src.
 ## Available scripts
 In the project directory you can run:
 ### `elm-app build`
-Builds the app for production to the `dist` folder.  
+Builds the app for production to the `build` folder.  
 
 The build is minified, and the filenames include the hashes.  
 Your app is ready to be deployed!
@@ -177,26 +177,71 @@ other html and javascript content types.
 ```
 
 ## IDE setup for Hot Module Replacement
+
 Remember to disable [safe write](https://webpack.github.io/docs/webpack-dev-server.html#working-with-editors-ides-supporting-safe-write) if you are using VIM or IntelliJ IDE, such as WebStorm.
 
-## Deploying to GitHub Pages
+## Deployment
+
+
+`elm-app build` creates a `build` directory with a production build of your app. Set up your favourite HTTP server so that a visitor to your site is served `index.html`, and requests to static paths like `/static/js/main.<hash>.js` are served with the contents of the `/static/js/main.<hash>.js` file.
+
+### Static Server
+
+For environments using [Node](https://nodejs.org/), the easiest way to handle this would be to install [serve](https://github.com/zeit/serve) and let it handle the rest:
 
-#### Step 1: install [gh-pages](https://github.com/tschaub/gh-pages)
 ```sh
-npm install gh-pages -g
+npm install -g serve
+serve -s build
 ```
 
-#### Step 2: configure `SERVED_PATH` environment variable
-Create a `.env` file in the root of your project to specify the `SERVED_PATH` environment variable.
+The last command shown above will serve your static site on the port **5000**. Like many of [serve](https://github.com/zeit/serve)’s internal settings, the port can be adjusted using the `-p` or `--port` flags.
+
+Run this command to get a full list of the options available:
 
+```sh
+serve -h
 ```
-SERVED_PATH=./
+
+### GitHub Pages
+
+>Note: this feature is available with `react-scripts@0.2.0` and higher.
+
+#### Step 1: Add `homepage` to `package.json`
+
+**The step below is important!**<br>
+**If you skip it, your app will not deploy correctly.**
+
+Open your `package.json` and add a `homepage` field:
+
+```js
+  "homepage": "https://myusername.github.io/my-app",
 ```
 
-The path must be `./` so the assets are served using relative paths.
+Create React App uses the `homepage` field to determine the root URL in the built HTML file.
+
+The `predeploy` script will run automatically before `deploy` is run.
+
+#### Step 2: Deploy the site by running `gh-pages -d build`
+
+Then run:
 
-#### Step 3: build the project and deploy it to GitHub Pages
 ```sh
-elm-app build
-gh-pages -d dist
+gh-pages -d build
 ```
+
+#### Step 3: Ensure your project’s settings use `gh-pages`
+
+Finally, make sure **GitHub Pages** option in your GitHub project settings is set to use the `gh-pages` branch:
+
+<img src="http://i.imgur.com/HUjEr9l.png" width="500" alt="gh-pages branch setting">
+
+#### Step 4: Optionally, configure the domain
+
+You can configure a custom domain with GitHub Pages by adding a `CNAME` file to the `public/` folder.
+
+#### Notes on client-side routing
+
+GitHub Pages doesn’t support routers that use the HTML5 `pushState` history API under the hood (for example, React Router using `browserHistory`). This is because when there is a fresh page load for a url like `http://user.github.io/todomvc/todos/42`, where `/todos/42` is a frontend route, the GitHub Pages server returns 404 because it knows nothing of `/todos/42`. If you want to add a router to a project hosted on GitHub Pages, here are a couple of solutions:
+
+* You could switch from using HTML5 history API to routing with hashes. If you use React Router, you can switch to `hashHistory` for this effect, but the URL will be longer and more verbose (for example, `http://user.github.io/todomvc/#/todos/42?_k=yknaj`). [Read more](https://reacttraining.com/react-router/web/api/Router) about different history implementations in React Router.
+* Alternatively, you can use a trick to teach GitHub Pages to handle 404 by redirecting to your `index.html` page with a special redirect parameter. You would need to add a `404.html` file with the redirection code to the `build` folder before deploying your project, and you’ll need to add code handling the redirect parameter to `index.html`. You can find a detailed explanation of this technique [in this guide](https://github.com/rafrex/spa-github-pages).
diff --git a/template/gitignore b/template/gitignore
index f9761a67..e7e7f129 100644
--- a/template/gitignore
+++ b/template/gitignore
@@ -1,5 +1,5 @@
 # Distribution
-dist/
+build/
 
 # elm-package generated files
 elm-stuff
diff --git a/template/src/favicon.ico b/template/public/favicon.ico
similarity index 100%
rename from template/src/favicon.ico
rename to template/public/favicon.ico
diff --git a/template/src/index.html b/template/public/index.html
similarity index 79%
rename from template/src/index.html
rename to template/public/index.html
index 945a683d..f9844d97 100644
--- a/template/src/index.html
+++ b/template/public/index.html
@@ -1,9 +1,10 @@
 <!DOCTYPE html>
 <html lang="en">
 <head>
-    <meta charset="UTF-8">
+    <meta charset="utf-8">
     <meta http-equiv="x-ua-compatible" content="ie=edge">
     <meta name="viewport" content="width=device-width, initial-scale=1, shrink-to-fit=no">
+    <link rel="shortcut icon" href="%PUBLIC_URL%/favicon.ico">
     <title>Elm App</title>
 </head>
 <body>
diff --git a/template/src/index.js b/template/src/index.js
index e93b8eba..16580d63 100644
--- a/template/src/index.js
+++ b/template/src/index.js
@@ -1,7 +1,5 @@
-import './main.css'
-const logoPath = require('./logo.svg')
-const Elm = require('./App.elm')
+import './main.css';
+import logoPath from './logo.svg';
+const { App } = require('./App.elm');
 
-const root = document.getElementById('root')
-
-Elm.App.embed(root, logoPath)
+App.embed(document.getElementById('root'), logoPath);
diff --git a/tests/build.spec.js b/tests/build.spec.js
new file mode 100644
index 00000000..749b26b0
--- /dev/null
+++ b/tests/build.spec.js
@@ -0,0 +1,53 @@
+/* eslint-disable */
+/* eslint-env mocha */
+const fs = require('fs');
+const path = require('path');
+const spawn = require('cross-spawn');
+const rimraf = require('rimraf');
+const expect = require('chai').expect;
+const Nightmare = require('nightmare');
+
+const testAppName = 'test-app';
+const rootDir = path.resolve(__dirname, '..');
+const testAppDir = path.join(rootDir, testAppName);
+const createElmAppCmd = path.join(rootDir, 'bin/create-elm-app-cli.js');
+const elmAppCmd = path.join(rootDir, 'bin/elm-app-cli.js');
+
+describe('Creating and making a build of Elm application', function() {
+  this.timeout(25000);
+
+  before(done => {
+    process.env.PUBLIC_URL = './';
+    spawn('node', [createElmAppCmd, testAppName]).on('close', status => {
+      if (status === 0) {
+        spawn('node', [elmAppCmd, 'build'], {
+          cwd: testAppDir
+        }).on('close', status => {
+          if (status === 0) {
+            done();
+          }
+        });
+      } else {
+        done(false);
+      }
+    });
+  });
+
+  after(() => {
+    rimraf.sync(testAppDir);
+  });
+
+  it('compiled correctly and renders "Your Elm App is working!" text', done => {
+    Nightmare()
+      .goto('file://' + path.resolve(testAppDir, 'build/index.html'))
+      .evaluate(() => {
+        return document.body.innerText;
+      })
+      .end()
+      .then(result => {
+        expect(result.trim()).to.be.equal('Your Elm App is working!');
+        done();
+      })
+      .catch(done);
+  });
+});
diff --git a/tests/cliAccessibility.js b/tests/cliAccessibility.js
index c353bf34..7476c8ce 100644
--- a/tests/cliAccessibility.js
+++ b/tests/cliAccessibility.js
@@ -1,37 +1,41 @@
 /* eslint-env mocha */
-const expect = require('chai').expect
-const spawn = require('cross-spawn')
-const rimraf = require('rimraf')
+const expect = require('chai').expect;
+const spawn = require('cross-spawn');
+const rimraf = require('rimraf');
 
-const testAppName = 'test-app'
+const testAppName = 'test-app';
 
-describe('Test command line interface functionality', function () {
-  after(function () {
-    rimraf.sync(testAppName)
-  })
+describe('Test command line interface functionality', function() {
+  after(function() {
+    rimraf.sync(testAppName);
+  });
 
-  describe('CLI accessibility', function () {
-    it('`create-elm-app` command should be available', function () {
-      const output = spawn.sync('create-elm-app').output
-      expect(output.toString()).to.have.string('Usage: create-elm-app <project-directory>')
-    })
+  describe('CLI accessibility', function() {
+    it('`create-elm-app` command should be available', function() {
+      const output = spawn.sync('create-elm-app').output;
+      expect(output.toString()).to.have.string(
+        'Usage: create-elm-app <project-directory>'
+      );
+    });
 
-    it('`elm-app` command should be available', function () {
-      const result = spawn.sync('elm-app')
-      const output = result.output
-      expect(output.toString()).to.have.string('Usage: elm-app <command>')
-    })
+    it('`elm-app` command should be available', function() {
+      const result = spawn.sync('elm-app');
+      const output = result.output;
+      expect(output.toString()).to.have.string('Usage: elm-app <command>');
+    });
 
-    it('`elm-app package` command should be available', function () {
-      const result = spawn.sync('elm-app', [ 'package' ])
-      const output = concatsStringBuffers(result.output)
-      expect(output).to.have.string('install and publish elm packages')
-    })
-  })
-})
+    it('`elm-app package` command should be available', function() {
+      const result = spawn.sync('elm-app', ['package']);
+      const output = concatsStringBuffers(result.output);
+      expect(output).to.have.string('install and publish elm packages');
+    });
+  });
+});
 
-function concatsStringBuffers (buffers) {
-  return buffers.map(function (out) {
-    return (out !== null) ? out.toString() : ''
-  }).join('')
+function concatsStringBuffers(buffers) {
+  return buffers
+    .map(function(out) {
+      return out !== null ? out.toString() : '';
+    })
+    .join('');
 }
diff --git a/tests/create-elm-app.spec.js b/tests/create-elm-app.spec.js
index b8df5d9c..ce1ce2db 100644
--- a/tests/create-elm-app.spec.js
+++ b/tests/create-elm-app.spec.js
@@ -1,38 +1,48 @@
 /* eslint-env mocha */
-const path = require('path')
-const expect = require('chai').expect
-const spawn = require('cross-spawn')
-const dircompare = require('dir-compare')
-const fs = require('fs')
-const rimraf = require('rimraf')
+const path = require('path');
+const expect = require('chai').expect;
+const spawn = require('cross-spawn');
+const dircompare = require('dir-compare');
+const fs = require('fs');
+const rimraf = require('rimraf');
 
-const testAppName = 'test-app'
-const rootDir = path.resolve(__dirname, '..')
-const testAppDir = path.join(rootDir, testAppName)
-const createElmAppCmd = path.join(rootDir, 'bin/create-elm-app-cli.js')
+const testAppName = 'test-app';
+const rootDir = path.resolve(__dirname, '..');
+const testAppDir = path.join(rootDir, testAppName);
+const createElmAppCmd = path.join(rootDir, 'bin/create-elm-app-cli.js');
 
-describe('Create Elm application with `create-elm-app` command', function () {
-  after(function () {
-    rimraf.sync(testAppDir)
-  })
+describe('Create Elm application with `create-elm-app` command', function() {
+  after(function() {
+    rimraf.sync(testAppDir);
+  });
 
-  it('`create-elm-app ' + testAppName + '` should succeed', function () {
-    const status = spawn.sync('node', [ createElmAppCmd, testAppName ]).status
-    expect(status).to.be.equal(0)
-  }).timeout(60 * 1000)
+  it('`create-elm-app ' + testAppName + '` should succeed', function() {
+    const status = spawn.sync('node', [createElmAppCmd, testAppName]).status;
+    expect(status).to.be.equal(0);
+  }).timeout(60 * 1000);
 
-  it('`' + testAppName + '` should have elm-package.json file', function () {
-    expect(fs.existsSync(path.join(testAppDir, 'elm-package.json'))).to.be.equal(true)
-  })
+  it('`' + testAppName + '` should have elm-package.json file', function() {
+    expect(
+      fs.existsSync(path.join(testAppDir, 'elm-package.json'))
+    ).to.be.equal(true);
+  });
 
-  it('`' + testAppName + '` should have .gitignore file', function () {
-    expect(fs.existsSync(path.join(testAppDir, '.gitignore'))).to.be.equal(true)
-  })
+  it('`' + testAppName + '` should have .gitignore file', function() {
+    expect(fs.existsSync(path.join(testAppDir, '.gitignore'))).to.be.equal(
+      true
+    );
+  });
 
-  it('`' + testAppName + '` should have the same file structure as template', function () {
-    const templateDir = path.join(rootDir, 'template')
-    const options = { excludeFilter: 'elm-stuff, elm-package.json, gitignore, .gitignore' }
-    const same = dircompare.compareSync(templateDir, testAppDir, options).same
-    expect(same).to.be.equal(true)
-  })
-})
+  it(
+    '`' + testAppName + '` should have the same file structure as template',
+    function() {
+      const templateDir = path.join(rootDir, 'template');
+      const options = {
+        excludeFilter: 'elm-stuff, elm-package.json, gitignore, .gitignore'
+      };
+      const same = dircompare.compareSync(templateDir, testAppDir, options)
+        .same;
+      expect(same).to.be.equal(true);
+    }
+  );
+});
diff --git a/tests/elm-app.build.spec.js b/tests/elm-app.build.spec.js
index a8da22d6..60f7d98d 100644
--- a/tests/elm-app.build.spec.js
+++ b/tests/elm-app.build.spec.js
@@ -1,61 +1,66 @@
 /* eslint-env mocha */
-const fs = require('fs')
-const path = require('path')
-const spawn = require('cross-spawn')
-const rimraf = require('rimraf')
-const expect = require('chai').expect
-
-const testAppName = 'test-app'
-const rootDir = path.resolve(__dirname, '..')
-const testAppDir = path.join(rootDir, testAppName)
-const createElmAppCmd = path.join(rootDir, 'bin/create-elm-app-cli.js')
-const elmAppCmd = path.join(rootDir, 'bin/elm-app-cli.js')
-
-describe('Building Elm application with `elm-app build`', function () {
-  before(function (done) {
-    const cmd = spawn.sync('node', [ createElmAppCmd, testAppName ])
+const fs = require('fs');
+const path = require('path');
+const spawn = require('cross-spawn');
+const rimraf = require('rimraf');
+const expect = require('chai').expect;
+
+const testAppName = 'test-app';
+const rootDir = path.resolve(__dirname, '..');
+const testAppDir = path.join(rootDir, testAppName);
+const createElmAppCmd = path.join(rootDir, 'bin/create-elm-app-cli.js');
+const elmAppCmd = path.join(rootDir, 'bin/elm-app-cli.js');
+
+describe('Building Elm application with `elm-app build`', function() {
+  before(function(done) {
+    const cmd = spawn.sync('node', [createElmAppCmd, testAppName]);
 
     if (cmd.status === 0) {
-      process.chdir(testAppDir)
-      done()
+      process.chdir(testAppDir);
+      done();
     } else {
-      done(false)
+      done(false);
     }
-  })
-
-  after(function () {
-    process.chdir(rootDir)
-    rimraf.sync(testAppDir)
-  })
-
-  it('`elm-app build` should succeed in `' + testAppName + '`', function () {
-    const result = spawn.sync('node', [ elmAppCmd, 'build' ])
-    const outputString = result.output.map(function (out) {
-      return (out !== null) ? out.toString() : ''
-    }).join('')
-    expect(result.status).to.be.equal(0, 'Incorrect exit status code')
-    expect(outputString).to.have.string('build is ready in `dist/`')
-    expect(fs.existsSync(path.join(testAppDir, 'dist'))).to.be.equal(true)
-  }).timeout(12 * 60 * 1000)
-
-  it('`elm-app build` should exit with non zero status code when build failed', function () {
-    const normalFile = path.join(testAppDir, 'src/App.elm')
-    const malformedFile = path.join(rootDir, './tests/data/App.elm')
-
-    copyFileSync(normalFile, 'App.elm-normal')
-    copyFileSync(malformedFile, normalFile)
-
-    const result = spawn.sync('node', [ elmAppCmd, 'build' ])
-
-    const oldNormalFile = path.resolve('App.elm-normal')
-    copyFileSync(oldNormalFile, normalFile)
-    fs.unlink(oldNormalFile)
-
-    expect(result.status).to.be.at.least(1)
-  }).timeout(2 * 60 * 1000)
-})
-
-function copyFileSync (from, to) {
-  const fromData = fs.readFileSync(from)
-  fs.writeFileSync(to, fromData)
+  });
+
+  after(function() {
+    process.chdir(rootDir);
+    rimraf.sync(testAppDir);
+  });
+
+  it('`elm-app build` should succeed in `' + testAppName + '`', function() {
+    const result = spawn.sync('node', [elmAppCmd, 'build']);
+    const outputString = result.output
+      .map(function(out) {
+        return out !== null ? out.toString() : '';
+      })
+      .join('');
+    expect(result.status).to.be.equal(0, 'Incorrect exit status code');
+    expect(outputString).to.have.string('Compiled successfully.');
+    expect(fs.existsSync(path.join(testAppDir, 'build'))).to.be.equal(true);
+  }).timeout(12 * 60 * 1000);
+
+  it(
+    '`elm-app build` should exit with non zero status code when build failed',
+    function() {
+      const normalFile = path.join(testAppDir, 'src/App.elm');
+      const malformedFile = path.join(rootDir, './tests/data/App.elm');
+
+      copyFileSync(normalFile, 'App.elm-normal');
+      copyFileSync(malformedFile, normalFile);
+
+      const result = spawn.sync('node', [elmAppCmd, 'build']);
+
+      const oldNormalFile = path.resolve('App.elm-normal');
+      copyFileSync(oldNormalFile, normalFile);
+      fs.unlink(oldNormalFile);
+
+      expect(result.status).to.be.at.least(1);
+    }
+  ).timeout(2 * 60 * 1000);
+});
+
+function copyFileSync(from, to) {
+  const fromData = fs.readFileSync(from);
+  fs.writeFileSync(to, fromData);
 }
diff --git a/tests/elm-app.dist.spec.js b/tests/elm-app.dist.spec.js
deleted file mode 100644
index c3674a00..00000000
--- a/tests/elm-app.dist.spec.js
+++ /dev/null
@@ -1,52 +0,0 @@
-/* eslint-disable */
-/* eslint-env mocha */
-const fs = require('fs')
-const path = require('path')
-const spawn = require('cross-spawn')
-const rimraf = require('rimraf')
-const expect = require('chai').expect
-const Nightmare = require('nightmare')
-
-const testAppName = 'test-app'
-const rootDir = path.resolve(__dirname, '..')
-const testAppDir = path.join(rootDir, testAppName)
-const createElmAppCmd = path.join(rootDir, 'bin/create-elm-app-cli.js')
-const elmAppCmd = path.join(rootDir, 'bin/elm-app-cli.js')
-
-describe('Creating and making a dist build of Elm application', function () {
-  this.timeout(25000)
-
-  before(done => {
-    spawn('node', [createElmAppCmd, testAppName]).on('close', status => {
-      if (status === 0) {
-        spawn('node', [elmAppCmd, 'build'], {cwd: testAppDir}).on('close', status => {
-          if (status === 0) {
-            done()
-          }
-        })
-      } else {
-        done(false)
-      }
-    })
-  })
-
-  after(() => {
-    rimraf.sync(testAppDir)
-  })
-
-  it('compiled correctly and renders "Your Elm App is working!" text', done => {
-    Nightmare()
-      .goto('file://' + path.resolve(testAppDir, 'dist/index.html'))
-      .evaluate(() => {
-        return document.body.innerText
-      })
-      .end()
-      .then((result) => {
-        expect(result.trim()).to.be.equal('Your Elm App is working!')
-        done()
-      })
-      .catch(err => {
-        done(err)
-      })
-  })
-})
diff --git a/tests/elm-app.eject.spec.js b/tests/elm-app.eject.spec.js
index 06777d1a..dd99fa11 100644
--- a/tests/elm-app.eject.spec.js
+++ b/tests/elm-app.eject.spec.js
@@ -1,78 +1,87 @@
 /* eslint-env mocha */
-const fs = require('fs')
-const path = require('path')
-const expect = require('chai').expect
-const spawn = require('cross-spawn')
-const dircompare = require('dir-compare')
-const rimraf = require('rimraf')
+const fs = require('fs');
+const path = require('path');
+const expect = require('chai').expect;
+const spawn = require('cross-spawn');
+const dircompare = require('dir-compare');
+const rimraf = require('rimraf');
 
-const testAppName = 'test-app'
-const rootDir = path.resolve(__dirname, '..')
-const testAppDir = path.join(rootDir, testAppName)
-const createElmAppCmd = path.join(rootDir, 'bin/create-elm-app-cli.js')
-const elmAppCmd = path.join(rootDir, 'bin/elm-app-cli.js')
+const testAppName = 'test-app';
+const rootDir = path.resolve(__dirname, '..');
+const testAppDir = path.join(rootDir, testAppName);
+const createElmAppCmd = path.join(rootDir, 'bin/create-elm-app-cli.js');
+const elmAppCmd = path.join(rootDir, 'bin/elm-app-cli.js');
 
-describe('Ejecting Elm application. (Please wait...)', function () {
-  before(function (done) {
-    const cmd = spawn.sync('node', [ createElmAppCmd, testAppName ])
+describe('Ejecting Elm application. (Please wait...)', () => {
+  before(function(done) {
+    const cmd = spawn.sync('node', [createElmAppCmd, testAppName]);
 
     if (cmd.status === 0) {
-      process.chdir(testAppDir)
-      done()
+      process.chdir(testAppDir);
+      done();
     } else {
-      done(false)
+      done(false);
     }
-  })
+  });
 
-  after(function () {
-    process.chdir(rootDir)
-    rimraf.sync(testAppDir)
-  })
+  after(function() {
+    process.chdir(rootDir);
+    rimraf.sync(testAppDir);
+  });
 
-  it('`elm-app eject` should succeed in `' + testAppName + '`', function () {
-    const result = spawn.sync('node', [ elmAppCmd, 'eject' ])
-    const outputString = result.output.map(function (out) {
-      return (out !== null) ? out.toString() : ''
-    }).join('')
+  it('`elm-app eject` should succeed in `' + testAppName + '`', () => {
+    const result = spawn.sync('node', [elmAppCmd, 'eject']);
+    const outputString = result.output
+      .map(function(out) {
+        return out !== null ? out.toString() : '';
+      })
+      .join('');
 
-    expect(result.status).to.be.equal(0)
-    expect(outputString).to.have.string('Ejected successfully!')
-  }).timeout(10 * 60 * 1000)
+    expect(result.status).to.be.equal(0);
+    expect(outputString).to.have.string('Ejected successfully!');
+  }).timeout(10 * 60 * 1000);
 
-  it('Ejected application should have `package.json` with scripts from Create Elm App', function () {
-    const testAppPkg = path.join(testAppDir, './package.json')
-    const pkg = fs.readFileSync(testAppPkg, { encoding: 'utf-8' })
-    const pkgScripts = JSON.parse(pkg).scripts
+  it('Ejected application should have `package.json` with scripts from Create Elm App', () => {
+    const testAppPkg = path.join(testAppDir, './package.json');
+    const pkg = fs.readFileSync(testAppPkg, { encoding: 'utf-8' });
+    const pkgScripts = JSON.parse(pkg).scripts;
 
-    expect(pkgScripts).to.have.property('build', 'node scripts/build.js')
-    expect(pkgScripts).to.have.property('start', 'node scripts/start.js')
-    expect(pkgScripts).to.have.property('package', 'elm-package')
-    expect(pkgScripts).to.have.property('make', 'elm-make')
-    expect(pkgScripts).to.have.property('repl', 'elm-repl')
-    expect(pkgScripts).to.have.property('reactor', 'elm-reactor')
-  })
+    expect(pkgScripts).to.have.property('build', 'node scripts/build.js');
+    expect(pkgScripts).to.have.property('start', 'node scripts/start.js');
+    expect(pkgScripts).to.have.property('package', 'elm-package');
+    expect(pkgScripts).to.have.property('make', 'elm-make');
+    expect(pkgScripts).to.have.property('repl', 'elm-repl');
+    expect(pkgScripts).to.have.property('reactor', 'elm-reactor');
+  });
 
-  it('Ejected application should have build and start scripts', function () {
-    expect(fs.existsSync(path.join(testAppDir, './scripts/build.js')))
-      .to.be.equal(true)
-    expect(fs.existsSync(path.join(testAppDir, './scripts/start.js')))
-      .to.be.equal(true)
-  })
+  it('Ejected application should have build and start scripts', () => {
+    expect(
+      fs.existsSync(path.join(testAppDir, './scripts/build.js'))
+    ).to.be.equal(true);
+    expect(
+      fs.existsSync(path.join(testAppDir, './scripts/start.js'))
+    ).to.be.equal(true);
+  });
 
-  it('Ejected application should have the config available', function () {
-    const path1 = path.join(rootDir, './config')
-    const path2 = path.join(testAppDir, './config')
-    const same = dircompare.compareSync(path1, path2).same
-    expect(same).to.be.equal(true)
-  })
+  it('Ejected application should have the config available', () => {
+    const path1 = path.join(rootDir, './config');
+    const path2 = path.join(testAppDir, './config');
+    const same = dircompare.compareSync(path1, path2).same;
+    expect(same).to.be.equal(true);
+  });
 
-  it('It should be possible to build ejected applitaction, using npm scripts', function () {
-    const result = spawn.sync('npm', [ 'run', 'build' ])
-    const outputString = result.output.map(function (out) {
-      return (out !== null) ? out.toString() : ''
-    }).join('')
+  it(
+    'It should be possible to build ejected applitaction, using npm scripts',
+    () => {
+      const result = spawn.sync('npm', ['run', 'build']);
+      const outputString = result.output
+        .map(function(out) {
+          return out !== null ? out.toString() : '';
+        })
+        .join('');
 
-    expect(result.status).to.be.equal(0)
-    expect(outputString).to.have.string('build is ready in `dist/`')
-  }).timeout(5 * 60 * 1000)
-})
+      expect(result.status).to.be.equal(0);
+      expect(outputString).to.have.string('Compiled successfully');
+    }
+  ).timeout(5 * 60 * 1000);
+});
diff --git a/tests/elm-app.test.spec.js b/tests/elm-app.test.spec.js
index 46a3a5e9..5dd5c5ed 100644
--- a/tests/elm-app.test.spec.js
+++ b/tests/elm-app.test.spec.js
@@ -1,40 +1,42 @@
 /* eslint-env mocha */
-const path = require('path')
-const spawn = require('cross-spawn')
-const rimraf = require('rimraf')
-const expect = require('chai').expect
+const path = require('path');
+const spawn = require('cross-spawn');
+const rimraf = require('rimraf');
+const expect = require('chai').expect;
 
-const testAppName = 'test-app'
-const rootDir = path.resolve(__dirname, '..')
-const testAppDir = path.join(rootDir, testAppName)
-const createElmAppCmd = path.join(rootDir, 'bin/create-elm-app-cli.js')
-const elmAppCmd = path.join(rootDir, 'bin/elm-app-cli.js')
+const testAppName = 'test-app';
+const rootDir = path.resolve(__dirname, '..');
+const testAppDir = path.join(rootDir, testAppName);
+const createElmAppCmd = path.join(rootDir, 'bin/create-elm-app-cli.js');
+const elmAppCmd = path.join(rootDir, 'bin/elm-app-cli.js');
 
-describe('Testing Elm application with `elm-app test` (Please wait...)', function () {
-  before(function (done) {
-    const cmd = spawn.sync('node', [ createElmAppCmd, testAppName ])
+describe('Testing Elm application with `elm-app test` (Please wait...)', function() {
+  before(function(done) {
+    const cmd = spawn.sync('node', [createElmAppCmd, testAppName]);
 
     if (cmd.status === 0) {
-      process.chdir(testAppDir)
-      done()
+      process.chdir(testAppDir);
+      done();
     } else {
-      done(false)
+      done(false);
     }
-  })
+  });
 
-  after(function () {
-    process.chdir(rootDir)
-    rimraf.sync(testAppDir)
-  })
+  after(function() {
+    process.chdir(rootDir);
+    rimraf.sync(testAppDir);
+  });
 
-  it('`elm-app test` should succeed in `' + testAppName + '`', function () {
-    const result = spawn.sync('node', [ elmAppCmd, 'test' ])
-    const outputString = result.output.map(function (out) {
-      return (out !== null) ? out.toString() : ''
-    }).join('')
+  it('`elm-app test` should succeed in `' + testAppName + '`', function() {
+    const result = spawn.sync('node', [elmAppCmd, 'test']);
+    const outputString = result.output
+      .map(function(out) {
+        return out !== null ? out.toString() : '';
+      })
+      .join('');
 
-    expect(result.status).to.be.at.least(1)
-    expect(outputString).to.have.string('This test should fail')
-    expect(outputString).to.have.string('failed as expected!')
-  }).timeout(2 * 60 * 1000)
-})
+    expect(result.status).to.be.at.least(1);
+    expect(outputString).to.have.string('This test should fail');
+    expect(outputString).to.have.string('failed as expected!');
+  }).timeout(2 * 60 * 1000);
+});
diff --git a/yarn.lock b/yarn.lock
index 7bfd3909..f1f3d951 100644
--- a/yarn.lock
+++ b/yarn.lock
@@ -5180,7 +5180,7 @@ request@2.74.0, request@~2.74.0:
     tough-cookie "~2.3.0"
     tunnel-agent "~0.4.1"
 
-request@2.79.0, request@^2.74.0, request@^2.78.0:
+request@2.79.0, request@^2.78.0:
   version "2.79.0"
   resolved "https://registry.yarnpkg.com/request/-/request-2.79.0.tgz#4dfe5bf6be8b8cdc37fcf93e04b65577722710de"
   dependencies:
@@ -5205,7 +5205,7 @@ request@2.79.0, request@^2.74.0, request@^2.78.0:
     tunnel-agent "~0.4.1"
     uuid "^3.0.0"
 
-request@^2.45.0, request@^2.81.0:
+request@^2.45.0, request@^2.74.0, request@^2.81.0:
   version "2.81.0"
   resolved "https://registry.yarnpkg.com/request/-/request-2.81.0.tgz#c6928946a0e06c5f8d6f8a9333469ffda46298a0"
   dependencies: