diff --git a/meta.js b/meta.js index 1082b09e1d..8e2642c1fe 100644 --- a/meta.js +++ b/meta.js @@ -114,8 +114,10 @@ module.exports = { ".eslintrc.js": "lint", ".eslintignore": "lint", "config/test.env.js": "unit || e2e", + "build/webpack.test.conf.js": "e2e || (unit && runner === 'karma')", "test/unit/**/*": "unit", "test/unit/index.js": "unit && runner === 'karma'", + "test/unit/jest.conf.js": "unit && runner === 'jest'", "test/unit/karma.conf.js": "unit && runner === 'karma'", "test/unit/specs/index.js": "unit && runner === 'karma'", "test/unit/setup.js": "unit && runner === 'jest'", diff --git a/package.json b/package.json index 0fefd01e63..92538abd00 100644 --- a/package.json +++ b/package.json @@ -1,6 +1,6 @@ { "name": "vue-cli-template-webpack", - "version": "1.2.3", + "version": "1.2.4", "license": "MIT", "description": "A full-featured Webpack setup with hot-reload, lint-on-save, unit testing & css extraction.", "scripts": { diff --git a/template/.babelrc b/template/.babelrc index 050e00e28c..6e0aaac99c 100644 --- a/template/.babelrc +++ b/template/.babelrc @@ -5,12 +5,12 @@ }], "stage-2" ], - "plugins": ["transform-runtime"], + "plugins": ["transform-runtime"]{{#if_or unit e2e}}, "env": { "test": { "presets": ["env", "stage-2"]{{#if_eq runner "karma"}}, - "plugins": ["istanbul"] - {{/if_eq}} + "plugins": ["istanbul"]{{/if_eq}}{{#if_eq runner "jest"}}, + "plugins": ["transform-es2015-modules-commonjs", "dynamic-import-node"]{{/if_eq}} } - } + }{{/if_or}} } diff --git a/template/build/utils.js b/template/build/utils.js index 27f4bea66e..55c301fe8d 100644 --- a/template/build/utils.js +++ b/template/build/utils.js @@ -87,7 +87,7 @@ exports.createNotifierCallback = function () { } const error = errors[0] - const filename = error.file.split('!').pop() + const filename = error.file && error.file.split('!').pop() notifier.notify({ title: pkg.name, message: severity + ': ' + error.name, diff --git a/template/build/vue-loader.conf.js b/template/build/vue-loader.conf.js index d2ece8f322..847f7cf2b9 100644 --- a/template/build/vue-loader.conf.js +++ b/template/build/vue-loader.conf.js @@ -13,6 +13,7 @@ module.exports = { extract: isProduction }), cssSourceMap: sourceMapEnabled, + cacheBusting: config.dev.cacheBusting, transformToRequire: { video: 'src', source: 'src', diff --git a/template/build/webpack.dev.conf.js b/template/build/webpack.dev.conf.js index d344b962b4..813a7b0ccd 100644 --- a/template/build/webpack.dev.conf.js +++ b/template/build/webpack.dev.conf.js @@ -14,12 +14,13 @@ const devWebpackConfig = merge(baseWebpackConfig, { }, // cheap-module-eval-source-map is faster for development devtool: config.dev.devtool, - + // these devServer options should be customized in /config/index.js devServer: { clientLogLevel: 'warning', historyApiFallback: true, hot: true, + compress: true, host: process.env.HOST || config.dev.host, port: process.env.PORT || config.dev.port, open: config.dev.autoOpenBrowser, @@ -37,7 +38,7 @@ const devWebpackConfig = merge(baseWebpackConfig, { plugins: [ new webpack.DefinePlugin({ 'process.env': require('../config/dev.env') - }), + }), new webpack.HotModuleReplacementPlugin(), new webpack.NamedModulesPlugin(), // HMR shows correct file names in console on update. new webpack.NoEmitOnErrorsPlugin(), diff --git a/template/build/webpack.prod.conf.js b/template/build/webpack.prod.conf.js index 205f9eda50..ffe2784fee 100644 --- a/template/build/webpack.prod.conf.js +++ b/template/build/webpack.prod.conf.js @@ -26,7 +26,7 @@ const webpackConfig = merge(baseWebpackConfig, { output: { path: config.build.assetsRoot, filename: utils.assetsPath('js/[name].[chunkhash].js'), - chunkFilename: utils.assetsPath('js/[name].[chunkhash].js') + chunkFilename: utils.assetsPath('js/[id].[chunkhash].js') }, plugins: [ // http://vuejs.github.io/vue-loader/en/workflow/production.html diff --git a/template/config/index.js b/template/config/index.js index 5242f081c2..96003c28c5 100644 --- a/template/config/index.js +++ b/template/config/index.js @@ -1,5 +1,5 @@ 'use strict' -// Template version: 1.2.3 +// Template version: 1.2.4 // see http://vuejs-templates.github.io/webpack for documentation. const path = require('path') @@ -14,7 +14,7 @@ module.exports = { // Various Dev Server settings host: 'localhost', // can be overwritten by process.env.HOST - port: 8080, // can be overwritten by process.env.HOST, if port is in use, a free one will be determined + port: 8080, // can be overwritten by process.env.PORT, if port is in use, a free one will be determined autoOpenBrowser: false, errorOverlay: true, notifyOnErrors: true, @@ -47,7 +47,7 @@ module.exports = { // just be aware of this issue when enabling this option. cssSourceMap: false, }, - + build: { // Template for index.html index: path.resolve(__dirname, '../dist/index.html'), @@ -64,14 +64,14 @@ module.exports = { productionSourceMap: false, // https://webpack.js.org/configuration/devtool/#production devtool: '#source-map', - + // Gzip off by default as many popular static hosts such as // Surge or Netlify already gzip all static assets for you. // Before setting to `true`, make sure to: // npm install --save-dev compression-webpack-plugin productionGzip: false, productionGzipExtensions: ['js', 'css'], - + // Run the build command with an extra argument to // View the bundle analyzer report after build finishes: // `npm run build --report` diff --git a/template/test/e2e/custom-assertions/elementCount.js b/template/test/e2e/custom-assertions/elementCount.js index c0103f9431..972e9508ab 100644 --- a/template/test/e2e/custom-assertions/elementCount.js +++ b/template/test/e2e/custom-assertions/elementCount.js @@ -1,11 +1,12 @@ // A custom Nightwatch assertion. -// the name of the method is the filename. -// can be used in tests like this: +// The assertion name is the filename. +// Example usage: // // browser.assert.elementCount(selector, count) // -// for how to write custom assertions see +// For more information on custom assertions see: // http://nightwatchjs.org/guide#writing-custom-assertions + exports.assertion = function (selector, count) { this.message = 'Testing if element <' + selector + '> has count: ' + count{{#if_eq lintConfig "airbnb"}};{{/if_eq}} this.expected = count{{#if_eq lintConfig "airbnb"}};{{/if_eq}} @@ -17,8 +18,8 @@ exports.assertion = function (selector, count) { } this.command = function (cb) { var self = this{{#if_eq lintConfig "airbnb"}};{{/if_eq}} - return this.api.execute(function (selector) { - return document.querySelectorAll(selector).length{{#if_eq lintConfig "airbnb"}};{{/if_eq}} + return this.api.execute(function (selectorToCount) { + return document.querySelectorAll(selectorToCount).length{{#if_eq lintConfig "airbnb"}};{{/if_eq}} }, [selector], function (res) { cb.call(self, res){{#if_eq lintConfig "airbnb"}};{{/if_eq}} }){{#if_eq lintConfig "airbnb"}};{{/if_eq}} diff --git a/template/test/unit/jest.conf.js b/template/test/unit/jest.conf.js new file mode 100644 index 0000000000..c524e9d7bd --- /dev/null +++ b/template/test/unit/jest.conf.js @@ -0,0 +1,32 @@ +const path = require('path') + +module.exports = { + rootDir: path.resolve(__dirname, '../../'), + moduleFileExtensions: [ + 'js', + 'json', + 'vue' + ], + moduleNameMapper: { + '^@/(.*)$': '/src/$1' + }, + transform: { + '^.+\\.js$': '/node_modules/babel-jest', + '.*\\.(vue)$': '/node_modules/vue-jest' + },{{#e2e}} + testPathIgnorePatterns: [ + '/test/e2e' + ],{{/e2e}} + snapshotSerializers: ['/node_modules/jest-serializer-vue'], + setupFiles: ['/test/unit/setup'], + mapCoverage: true, + coverageDirectory: '/test/unit/coverage', + collectCoverageFrom: [ + 'src/**/*.{js,vue}', + '!src/main.js', + {{#router}} + '!src/router/index.js', + {{/router}} + '!**/node_modules/**' + ] +}