diff --git a/.circleci/config.yml b/.circleci/config.yml
index c5186160e0..53acfb44c9 100644
--- a/.circleci/config.yml
+++ b/.circleci/config.yml
@@ -1,7 +1,7 @@
 version: 2
 vm_settings: &vm_settings
   docker:
-    - image: circleci/node:6.12.3-browsers
+    - image: circleci/node:8-stretch-browsers
 
 jobs:
   install_template_deps:
@@ -86,6 +86,10 @@ jobs:
           name: Test build
           command: npm run build
           when: always
+      - store_artifacts:
+          path: ~/project/webpack-template/test-full/logs
+      - store_artifacts:
+          path: ~/project/webpack-template/test-full/tests_output
 
   scenario_full-karma-airbnb:
     <<: *vm_settings
@@ -119,6 +123,10 @@ jobs:
           name: Test build
           command: npm run build
           when: always
+      - store_artifacts:
+          path: ~/project/webpack-template/test-full-karma-airbnb/logs
+      - store_artifacts:
+          path: ~/project/webpack-template/test-full-karma-airbnb/tests_output
 
 
 workflows:
diff --git a/README.md b/README.md
index 476c8224a2..46e2ddf42d 100644
--- a/README.md
+++ b/README.md
@@ -11,10 +11,10 @@
 
 ## Usage
 
-This is a project template for [vue-cli](https://github.com/vuejs/vue-cli). **It is recommended to use npm 3+ for a more efficient dependency tree.**
+This is a project template for [@vue/cli](https://github.com/vuejs/vue-cli). **@vue/cli require Node.js 8 or above (8.10.0+ recommended)**
 
 ``` bash
-$ npm install -g vue-cli
+$ npm install -g @vue/cli @vue/cli-init
 $ vue init webpack my-project
 $ cd my-project
 $ npm install
diff --git a/docs/babel.md b/docs/babel.md
index eaa0ca9d83..f33b206f6a 100644
--- a/docs/babel.md
+++ b/docs/babel.md
@@ -1,6 +1,6 @@
 # Babel Configuration
 
-This boilerplate uses [`babel-preset-env`](https://www.npmjs.com/package/babel-preset-env) for configuring babel. You can read more about it here - http://2ality.com/2017/02/babel-preset-env.html.
+This boilerplate uses [`@babel/preset-env`](https://www.npmjs.com/package/@babel/preset-env) for configuring babel. You can read more about it here - http://2ality.com/2017/02/babel-preset-env.html.
 
 > A Babel preset that compiles ES2015+ down to ES5 by automatically determining the Babel plugins and polyfills you need based on your targeted browser or runtime environments.
 
@@ -19,4 +19,4 @@ However there is a caveat. `browserslist` recommends defining the target in a co
 }
 ```
 
-But the latest stable release of `babel-preset-env`, `v1.6.1` does not support loading the config from `package.json`. So the target environment is repeated in `.babelrc`. If you wish to change your target environment, please be sure to update both `package.json` and `.babelrc`. Note that this has been fixed in the beta version([`@babel/preset-env@7.0.0-beta.34`](https://github.com/babel/babel/tree/master/packages/babel-preset-env)) and the template will be updated once it is out of beta.
+[`@babel/preset-env`](https://www.npmjs.com/package/@babel/preset-env) also support `browserslist` config in `package.json`.
diff --git a/docs/structure.md b/docs/structure.md
index 341a51614b..132029d6d4 100644
--- a/docs/structure.md
+++ b/docs/structure.md
@@ -28,7 +28,7 @@
 │   │   ├── custom-assertions/  # custom assertions for e2e tests
 │   │   ├── runner.js           # test runner script
 │   │   └── nightwatch.conf.js  # test runner config file
-├── .babelrc                    # babel config
+├── babel.config.js             # babel config
 ├── .editorconfig               # indentation, spaces/tabs and similar settings for your editor
 ├── .eslintrc.js                # eslint config
 ├── .eslintignore               # eslint ignore rules
diff --git a/package-lock.json b/package-lock.json
index 21209e981e..a1c2e693f7 100644
--- a/package-lock.json
+++ b/package-lock.json
@@ -1,6 +1,6 @@
 {
   "name": "vue-cli-template-webpack",
-  "version": "1.2.8",
+  "version": "1.3.1",
   "lockfileVersion": 1,
   "requires": true,
   "dependencies": {
diff --git a/package.json b/package.json
index db88d649df..573a96aef5 100644
--- a/package.json
+++ b/package.json
@@ -8,6 +8,7 @@
     "docs:deploy": "bash ./deploy-docs.sh"
   },
   "devDependencies": {
-    "vue-cli": "^2.8.1"
+    "@vue/cli": "^3.0.0-beta.16",
+    "@vue/cli-init": "^3.0.0-beta.16"
   }
 }
diff --git a/template/.babelrc b/template/.babelrc
deleted file mode 100644
index 6646ce7f96..0000000000
--- a/template/.babelrc
+++ /dev/null
@@ -1,19 +0,0 @@
-{
-  "presets": [
-    ["env", {
-      "modules": false,
-      "targets": {
-        "browsers": ["> 1%", "last 2 versions", "not ie <= 8"]
-      }
-    }],
-    "stage-2"
-  ],
-  "plugins": ["transform-vue-jsx", "transform-runtime"]{{#if_or unit e2e}},
-  "env": {
-    "test": {
-      "presets": ["env", "stage-2"]{{#if_eq runner "karma"}},
-      "plugins": ["transform-vue-jsx", "istanbul"]{{/if_eq}}{{#if_eq runner "jest"}},
-      "plugins": ["transform-vue-jsx", "transform-es2015-modules-commonjs", "dynamic-import-node"]{{/if_eq}}
-    }
-  }{{/if_or}}
-}
diff --git a/template/babel.config.js b/template/babel.config.js
new file mode 100644
index 0000000000..575091454d
--- /dev/null
+++ b/template/babel.config.js
@@ -0,0 +1,30 @@
+module.exports = {
+  presets: [
+    ["@babel/preset-env", {
+      "modules": false
+    }],
+    ["@babel/preset-stage-2", {
+      decoratorsLegacy: true
+    }]
+  ],
+  plugins: ["transform-vue-jsx", "@babel/plugin-transform-runtime"]{{#if_or unit e2e}},
+  env: {
+    test: {
+      presets: [
+        "@babel/preset-env",
+        ["@babel/preset-stage-2", {
+          decoratorsLegacy: true
+        }]
+      ]{{#if_eq runner "karma"}},
+      plugins: [
+        "transform-vue-jsx",
+        "istanbul"
+      ]{{/if_eq}}{{#if_eq runner "jest"}},
+      plugins: [
+        "transform-vue-jsx",
+        "@babel/plugin-transform-modules-commonjs",
+        "dynamic-import-node"
+      ]{{/if_eq}}
+    }
+  }{{/if_or}}
+}
diff --git a/template/build/utils.js b/template/build/utils.js
index e534fb0fd6..2d640e24f9 100644
--- a/template/build/utils.js
+++ b/template/build/utils.js
@@ -1,7 +1,7 @@
 'use strict'
 const path = require('path')
 const config = require('../config')
-const ExtractTextPlugin = require('extract-text-webpack-plugin')
+const MiniCssExtractPlugin = require('mini-css-extract-plugin')
 const packageConfig = require('../package.json')
 
 exports.assetsPath = function (_path) {
@@ -31,7 +31,22 @@ exports.cssLoaders = function (options) {
 
   // generate loader string to be used with extract text plugin
   function generateLoaders (loader, loaderOptions) {
-    const loaders = options.usePostCSS ? [cssLoader, postcssLoader] : [cssLoader]
+    const loaders = []
+
+    // Extract CSS when that option is specified
+    // (which is the case during production build)
+    if (options.extract) {
+      loaders.push(MiniCssExtractPlugin.loader)
+    }
+    else {
+      loaders.push('vue-style-loader')
+    }
+
+    loaders.push(cssLoader)
+
+    if (options.usePostCSS) {
+      loaders.push(postcssLoader)
+    }
 
     if (loader) {
       loaders.push({
@@ -42,16 +57,7 @@ exports.cssLoaders = function (options) {
       })
     }
 
-    // Extract CSS when that option is specified
-    // (which is the case during production build)
-    if (options.extract) {
-      return ExtractTextPlugin.extract({
-        use: loaders,
-        fallback: 'vue-style-loader'
-      })
-    } else {
-      return ['vue-style-loader'].concat(loaders)
-    }
+    return loaders
   }
 
   // https://vue-loader.vuejs.org/en/configurations/extract-css.html
diff --git a/template/build/vue-loader.conf.js b/template/build/vue-loader.conf.js
index 33ed58bc0a..1231f46329 100644
--- a/template/build/vue-loader.conf.js
+++ b/template/build/vue-loader.conf.js
@@ -1,19 +1,9 @@
 'use strict'
-const utils = require('./utils')
 const config = require('../config')
-const isProduction = process.env.NODE_ENV === 'production'
-const sourceMapEnabled = isProduction
-  ? config.build.productionSourceMap
-  : config.dev.cssSourceMap
 
 module.exports = {
-  loaders: utils.cssLoaders({
-    sourceMap: sourceMapEnabled,
-    extract: isProduction
-  }),
-  cssSourceMap: sourceMapEnabled,
   cacheBusting: config.dev.cacheBusting,
-  transformToRequire: {
+  transformAssetUrls: {
     video: ['src', 'poster'],
     source: 'src',
     img: 'src',
diff --git a/template/build/webpack.base.conf.js b/template/build/webpack.base.conf.js
index 391160c571..f53fc6adf2 100644
--- a/template/build/webpack.base.conf.js
+++ b/template/build/webpack.base.conf.js
@@ -3,6 +3,7 @@ const path = require('path')
 const utils = require('./utils')
 const config = require('../config')
 const vueLoaderConfig = require('./vue-loader.conf')
+const { VueLoaderPlugin } = require('vue-loader')
 
 function resolve (dir) {
   return path.join(__dirname, '..', dir)
@@ -31,6 +32,9 @@ module.exports = {
       ? config.build.assetsPublicPath
       : config.dev.assetsPublicPath
   },
+  plugins: [
+    new VueLoaderPlugin(),
+  ],
   resolve: {
     extensions: ['.js', '.vue', '.json'],
     alias: {
diff --git a/template/build/webpack.dev.conf.js b/template/build/webpack.dev.conf.js
index 070ae221f3..1fee86bf85 100755
--- a/template/build/webpack.dev.conf.js
+++ b/template/build/webpack.dev.conf.js
@@ -14,6 +14,7 @@ const HOST = process.env.HOST
 const PORT = process.env.PORT && Number(process.env.PORT)
 
 const devWebpackConfig = merge(baseWebpackConfig, {
+  mode: 'development',
   module: {
     rules: utils.styleLoaders({ sourceMap: config.dev.cssSourceMap, usePostCSS: true })
   },
@@ -49,8 +50,6 @@ const devWebpackConfig = merge(baseWebpackConfig, {
       'process.env': require('../config/dev.env')
     }),
     new webpack.HotModuleReplacementPlugin(),
-    new webpack.NamedModulesPlugin(), // HMR shows correct file names in console on update.
-    new webpack.NoEmitOnErrorsPlugin(),
     // https://github.com/ampedandwired/html-webpack-plugin
     new HtmlWebpackPlugin({
       filename: 'index.html',
@@ -65,7 +64,10 @@ const devWebpackConfig = merge(baseWebpackConfig, {
         ignore: ['.*']
       }
     ])
-  ]
+  ],
+  optimization: {
+    noEmitOnErrors: true,
+  },
 })
 
 module.exports = new Promise((resolve, reject) => {
diff --git a/template/build/webpack.prod.conf.js b/template/build/webpack.prod.conf.js
index fc5d53fa3d..0ab692d01c 100644
--- a/template/build/webpack.prod.conf.js
+++ b/template/build/webpack.prod.conf.js
@@ -7,7 +7,7 @@ const merge = require('webpack-merge')
 const baseWebpackConfig = require('./webpack.base.conf')
 const CopyWebpackPlugin = require('copy-webpack-plugin')
 const HtmlWebpackPlugin = require('html-webpack-plugin')
-const ExtractTextPlugin = require('extract-text-webpack-plugin')
+const MiniCssExtractPlugin = require('mini-css-extract-plugin')
 const OptimizeCSSPlugin = require('optimize-css-assets-webpack-plugin')
 const UglifyJsPlugin = require('uglifyjs-webpack-plugin')
 
@@ -16,6 +16,7 @@ const env = {{#if_or unit e2e}}process.env.NODE_ENV === 'testing'
   : {{/if_or}}require('../config/prod.env')
 
 const webpackConfig = merge(baseWebpackConfig, {
+  mode: 'production',
   module: {
     rules: utils.styleLoaders({
       sourceMap: config.build.productionSourceMap,
@@ -27,30 +28,15 @@ const webpackConfig = merge(baseWebpackConfig, {
   output: {
     path: config.build.assetsRoot,
     filename: utils.assetsPath('js/[name].[chunkhash].js'),
-    chunkFilename: utils.assetsPath('js/[id].[chunkhash].js')
   },
   plugins: [
     // http://vuejs.github.io/vue-loader/en/workflow/production.html
     new webpack.DefinePlugin({
       'process.env': env
     }),
-    new UglifyJsPlugin({
-      uglifyOptions: {
-        compress: {
-          warnings: false
-        }
-      },
-      sourceMap: config.build.productionSourceMap,
-      parallel: true
-    }),
     // extract css into its own file
-    new ExtractTextPlugin({
-      filename: utils.assetsPath('css/[name].[contenthash].css'),
-      // Setting the following option to `false` will not extract CSS from codesplit chunks.
-      // Their CSS will instead be inserted dynamically with style-loader when the codesplit chunk has been loaded by webpack.
-      // It's currently set to `true` because we are seeing that sourcemaps are included in the codesplit bundle as well when it's `false`, 
-      // increasing file size: https://github.com/vuejs-templates/webpack/issues/1110
-      allChunks: true,
+    new MiniCssExtractPlugin({
+      filename: utils.assetsPath('css/[name].[chunkhash].css'),
     }),
     // Compress extracted CSS. We are using this plugin so that possible
     // duplicated CSS from different components can be deduped.
@@ -75,43 +61,12 @@ const webpackConfig = merge(baseWebpackConfig, {
         // more options:
         // https://github.com/kangax/html-minifier#options-quick-reference
       },
-      // necessary to consistently work with multiple chunks via CommonsChunkPlugin
+      // necessary to consistently work with multiple chunks
       chunksSortMode: 'dependency'
     }),
     // keep module.id stable when vendor modules does not change
+    new webpack.NamedChunksPlugin(),
     new webpack.HashedModuleIdsPlugin(),
-    // enable scope hoisting
-    new webpack.optimize.ModuleConcatenationPlugin(),
-    // split vendor js into its own file
-    new webpack.optimize.CommonsChunkPlugin({
-      name: 'vendor',
-      minChunks (module) {
-        // any required modules inside node_modules are extracted to vendor
-        return (
-          module.resource &&
-          /\.js$/.test(module.resource) &&
-          module.resource.indexOf(
-            path.join(__dirname, '../node_modules')
-          ) === 0
-        )
-      }
-    }),
-    // extract webpack runtime and module manifest to its own file in order to
-    // prevent vendor hash from being updated whenever app bundle is updated
-    new webpack.optimize.CommonsChunkPlugin({
-      name: 'manifest',
-      minChunks: Infinity
-    }),
-    // This instance extracts shared chunks from code splitted chunks and bundles them
-    // in a separate chunk, similar to the vendor chunk
-    // see: https://webpack.js.org/plugins/commons-chunk-plugin/#extra-async-commons-chunk
-    new webpack.optimize.CommonsChunkPlugin({
-      name: 'app',
-      async: 'vendor-async',
-      children: true,
-      minChunks: 3
-    }),
-
     // copy custom static assets
     new CopyWebpackPlugin([
       {
@@ -120,7 +75,31 @@ const webpackConfig = merge(baseWebpackConfig, {
         ignore: ['.*']
       }
     ])
-  ]
+  ],
+  optimization: {
+    splitChunks: {
+      chunks: 'all',
+      cacheGroups: {
+        vendor: {
+          name: 'vendor',
+          test: /[\\/]node_modules[\\/]/,
+          enforce: true,
+        },
+      },
+    },
+    runtimeChunk: 'single',
+    minimizer: [
+      new UglifyJsPlugin({
+        uglifyOptions: {
+          compress: {
+            warnings: false
+          }
+        },
+        sourceMap: config.build.productionSourceMap,
+        parallel: true
+      }),
+    ],
+  },
 })
 
 if (config.build.productionGzip) {
diff --git a/template/build/webpack.test.conf.js b/template/build/webpack.test.conf.js
index 0d658d9ebe..9ad270f3b7 100644
--- a/template/build/webpack.test.conf.js
+++ b/template/build/webpack.test.conf.js
@@ -7,6 +7,7 @@ const merge = require('webpack-merge')
 const baseWebpackConfig = require('./webpack.base.conf')
 
 const webpackConfig = merge(baseWebpackConfig, {
+  mode: 'development',
   // use inline sourcemap for karma-sourcemap-loader
   module: {
     rules: utils.styleLoaders()
diff --git a/template/logs/.gitignore b/template/logs/.gitignore
new file mode 100644
index 0000000000..d6b7ef32c8
--- /dev/null
+++ b/template/logs/.gitignore
@@ -0,0 +1,2 @@
+*
+!.gitignore
diff --git a/template/package.json b/template/package.json
index 207322b98c..7ead73a37b 100644
--- a/template/package.json
+++ b/template/package.json
@@ -25,22 +25,22 @@
     "build": "node build/build.js"
   },
   "dependencies": {
-    "vue": "^2.5.2"{{#router}},
+    "vue": "^2.5.16"{{#router}},
     "vue-router": "^3.0.1"{{/router}}
   },
   "devDependencies": {
     {{#lint}}
-    "babel-eslint": "^7.2.3",
+    "babel-eslint": "^8.2.1",
     "eslint": "^4.15.0",
-    "eslint-friendly-formatter": "^3.0.0",
-    "eslint-loader": "^1.7.1",
+    "eslint-friendly-formatter": "^4.0.1",
+    "eslint-loader": "^2.0.0",
     "eslint-plugin-vue": "^4.0.0",
     {{#if_eq lintConfig "standard"}}
-    "eslint-config-standard": "^10.2.1",
+    "eslint-config-standard": "^11.0.0",
     "eslint-plugin-promise": "^3.4.0",
-    "eslint-plugin-standard": "^3.0.1",
+    "eslint-plugin-standard": "^3.1.0",
     "eslint-plugin-import": "^2.7.0",
-    "eslint-plugin-node": "^5.2.0",
+    "eslint-plugin-node": "^6.0.1",
     {{/if_eq}}
     {{#if_eq lintConfig "airbnb"}}
     "eslint-config-airbnb-base": "^11.3.0",
@@ -49,73 +49,77 @@
     {{/if_eq}}
     {{/lint}}
     {{#if_eq runner "jest"}}
-    "babel-jest": "^21.0.2",
+    "babel-core": "^7.0.0-0",
+    "babel-jest": "^23.0.1",
     "babel-plugin-dynamic-import-node": "^1.2.0",
-    "babel-plugin-transform-es2015-modules-commonjs": "^6.26.0",
-    "jest": "^22.0.4",
-    "jest-serializer-vue": "^0.3.0",
-    "vue-jest": "^1.0.2",
+    "@babel/plugin-transform-modules-commonjs": "^7.0.0-beta.49",
+    "jest": "^23.1.0",
+    "jest-serializer-vue": "^2.0.2",
+    "vue-jest": "^2.6.0",
     {{/if_eq}}
     {{#if_eq runner "karma"}}
     "cross-env": "^5.0.1",
-    "karma": "^1.4.1",
+    "karma": "^2.0.2",
     "karma-coverage": "^1.1.1",
     "karma-mocha": "^1.3.0",
     "karma-phantomjs-launcher": "^1.0.2",
     "karma-phantomjs-shim": "^1.4.0",
     "karma-sinon-chai": "^1.3.1",
     "karma-sourcemap-loader": "^0.3.7",
-    "karma-spec-reporter": "0.0.31",
-    "karma-webpack": "^2.0.2",
-    "mocha": "^3.2.0",
+    "karma-spec-reporter": "0.0.32",
+    "karma-webpack": "^3.0.0",
+    "mocha": "^5.1.1",
     "chai": "^4.1.2",
     "sinon": "^4.0.0",
-    "sinon-chai": "^2.8.0",
-    "inject-loader": "^3.0.0",
-    "babel-plugin-istanbul": "^4.1.1",
+    "sinon-chai": "^3.0.0",
+    "inject-loader": "^4.0.1",
+    "babel-plugin-istanbul": "^4.1.6",
     "phantomjs-prebuilt": "^2.1.14",
     {{/if_eq}}
     {{#e2e}}
-    "babel-register": "^6.22.0",
-    "chromedriver": "^2.27.2",
-    "cross-spawn": "^5.0.1",
-    "nightwatch": "^0.9.12",
-    "selenium-server": "^3.0.1",
+    "@babel/register": "^7.0.0-beta.49",
+    "chromedriver": "^2.38.2",
+    "geckodriver": "^1.11.0",
+    "cross-spawn": "^6.0.5",
+    "nightwatch": "^1.0.3",
+    "selenium-server": "^3.11.0",
     {{/e2e}}
-    "autoprefixer": "^7.1.2",
-    "babel-core": "^6.22.1",
+    "autoprefixer": "^8.3.0",
+    "@babel/core": "^7.0.0-beta.49",
+    "@babel/plugin-syntax-jsx": "^7.0.0-beta.49",
+    "@babel/plugin-transform-runtime": "^7.0.0-beta.49",
+    "@babel/preset-env": "^7.0.0-beta.49",
+    "@babel/preset-stage-2": "^7.0.0-beta.49",
+    "@babel/runtime": "^7.0.0-beta.49",
     "babel-helper-vue-jsx-merge-props": "^2.0.3",
-    "babel-loader": "^7.1.1",
-    "babel-plugin-syntax-jsx": "^6.18.0",
-    "babel-plugin-transform-runtime": "^6.22.0",
-    "babel-plugin-transform-vue-jsx": "^3.5.0",
-    "babel-preset-env": "^1.3.2",
-    "babel-preset-stage-2": "^6.22.0",
-    "chalk": "^2.0.1",
+    "babel-loader": "^8.0.0-beta.3",
+    "babel-plugin-transform-vue-jsx": "^4.0.1",
+    "chalk": "^2.4.1",
     "copy-webpack-plugin": "^4.0.1",
     "css-loader": "^0.28.0",
-    "extract-text-webpack-plugin": "^3.0.0",
+    "mini-css-extract-plugin": "^0.4.0",
     "file-loader": "^1.1.4",
     "friendly-errors-webpack-plugin": "^1.6.1",
-    "html-webpack-plugin": "^2.30.1",
+    "html-webpack-plugin": "^3.2.0",
     "webpack-bundle-analyzer": "^2.9.0",
     "node-notifier": "^5.1.2",
     "postcss-import": "^11.0.0",
     "postcss-loader": "^2.0.8",
     "postcss-url": "^7.2.1",
     "semver": "^5.3.0",
-    "shelljs": "^0.7.6",
-    "optimize-css-assets-webpack-plugin": "^3.2.0",
-    "ora": "^1.2.0",
+    "shelljs": "^0.8.1",
+    "optimize-css-assets-webpack-plugin": "^4.0.0",
+    "ora": "^2.0.0",
     "rimraf": "^2.6.0",
     "uglifyjs-webpack-plugin": "^1.1.1",
-    "url-loader": "^0.5.8",
-    "vue-loader": "^13.3.0",
-    "vue-style-loader": "^3.0.1",
+    "url-loader": "^1.0.1",
+    "vue-loader": "^15.0.3",
+    "vue-style-loader": "^4.1.0",
     "vue-template-compiler": "^2.5.2",
     "portfinder": "^1.0.13",
-    "webpack": "^3.6.0",
-    "webpack-dev-server": "^2.9.1",
+    "webpack": "^4.6.0",
+    "webpack-cli": "^3.0.3",
+    "webpack-dev-server": "^3.1.3",
     "webpack-merge": "^4.1.0"
   },
   "engines": {
diff --git a/template/test/e2e/nightwatch.conf.js b/template/test/e2e/nightwatch.conf.js
index f019c0ac44..7dcbed6ce2 100644
--- a/template/test/e2e/nightwatch.conf.js
+++ b/template/test/e2e/nightwatch.conf.js
@@ -1,45 +1,78 @@
-require('babel-register')
-var config = require('../../config')
+require('@babel/register')
+const config = require('../../config')
+
+const paths = {
+  chromedriver: require('chromedriver').path,
+  geckodriver: require('geckodriver').path,
+  seleniumServer: require('selenium-server').path,
+  launchUrl: 'http://localhost:' + (process.env.PORT || config.dev.port),
+  logPath: 'logs',
+}
+
+const debugTests = false
+
+if (debugTests) {
+  console.log('paths:', paths)
+}
 
 // http://nightwatchjs.org/gettingstarted#settings-file
 module.exports = {
   src_folders: ['test/e2e/specs'],
   output_folder: 'test/e2e/reports',
   custom_assertions_path: ['test/e2e/custom-assertions'],
+  detailed_output: true,
+  silent: !debugTests,
+  launch_url: paths.launchUrl,
+  filter: '*.js',
 
-  selenium: {
-    start_process: true,
-    server_path: require('selenium-server').path,
-    host: '127.0.0.1',
-    port: 4444,
-    cli_args: {
-      'webdriver.chrome.driver': require('chromedriver').path
-    }
+  webdriver: {
+    server_path: paths.seleniumServer,
+    log_path: paths.logPath,
+    host: 'localhost',
+    port: 4444
   },
 
   test_settings: {
-    default: {
-      selenium_port: 4444,
-      selenium_host: 'localhost',
-      silent: true,
-      globals: {
-        devServerURL: 'http://localhost:' + (process.env.PORT || config.dev.port)
-      }
-    },
-
     chrome: {
+      start_session: true,
+      webdriver: {
+        start_process: true,
+        server_path: paths.chromedriver,
+        port: 9515,
+        cli_args: [
+          '--verbose'
+        ]
+      },
       desiredCapabilities: {
         browserName: 'chrome',
         javascriptEnabled: true,
-        acceptSslCerts: true
+        acceptSslCerts: true,
+        loggingPrefs: {
+          driver: 'INFO',
+          browser: 'INFO'
+        },
+        chromeOptions: {
+          args: [
+            '--headless',
+          ],
+        },
       }
     },
-
     firefox: {
+      start_session: true,
+      webdriver: {
+        start_process: true,
+        server_path: paths.geckodriver,
+        cli_args: [
+          '--log', 'debug'
+        ]
+      },
       desiredCapabilities: {
         browserName: 'firefox',
         javascriptEnabled: true,
-        acceptSslCerts: true
+        acceptSslCerts: true,
+        acceptInsecureCerts: true,
+        marionette: true
       }
     }
   }
diff --git a/template/test/e2e/specs/test.js b/template/test/e2e/specs/test.js
index 92ecc1216d..2992a56c42 100644
--- a/template/test/e2e/specs/test.js
+++ b/template/test/e2e/specs/test.js
@@ -6,10 +6,9 @@ module.exports = {
     // automatically uses dev Server port from /config.index.js
     // default: http://localhost:8080
     // see nightwatch.conf.js
-    const devServer = browser.globals.devServerURL
 
     browser
-      .url(devServer)
+      .url(browser.launch_url)
       .waitForElementVisible('#app', 5000)
       .assert.elementPresent('.hello')
       .assert.containsText('h1', 'Welcome to Your Vue.js App')
diff --git a/template/test/unit/jest.conf.js b/template/test/unit/jest.conf.js
index c524e9d7bd..51e27dc417 100644
--- a/template/test/unit/jest.conf.js
+++ b/template/test/unit/jest.conf.js
@@ -19,7 +19,6 @@ module.exports = {
   ],{{/e2e}}
   snapshotSerializers: ['<rootDir>/node_modules/jest-serializer-vue'],
   setupFiles: ['<rootDir>/test/unit/setup'],
-  mapCoverage: true,
   coverageDirectory: '<rootDir>/test/unit/coverage',
   collectCoverageFrom: [
     'src/**/*.{js,vue}',