From 05148da1757f8fe64858f6bbaa8a3831b2276ed8 Mon Sep 17 00:00:00 2001 From: Alex Kyriakidis Date: Mon, 9 Oct 2017 11:07:05 +0300 Subject: [PATCH 01/38] switch hello-world tag to PascalCase (#951) --- template/src/App.vue | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/template/src/App.vue b/template/src/App.vue index ebe5aba27d..2ef72e8cbc 100644 --- a/template/src/App.vue +++ b/template/src/App.vue @@ -4,7 +4,7 @@ {{#router}} {{else}} - + {{/router}} From 993717604d15b240e07d5da8d55b815452d11581 Mon Sep 17 00:00:00 2001 From: =?UTF-8?q?Thorsten=20L=C3=BCnborg?= Date: Wed, 11 Oct 2017 09:30:11 +0200 Subject: [PATCH 02/38] fix Es6 code issue. This file is not transpiled, so we should stick to ES5 --- template/build/dev-client.js | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/template/build/dev-client.js b/template/build/dev-client.js index 54693bd79b..2f75dd531f 100644 --- a/template/build/dev-client.js +++ b/template/build/dev-client.js @@ -1,7 +1,7 @@ /* eslint-disable */ 'use strict' require('eventsource-polyfill') -const hotClient = require('webpack-hot-middleware/client?noInfo=true&reload=true') +var hotClient = require('webpack-hot-middleware/client?noInfo=true&reload=true') hotClient.subscribe(function (event) { if (event.action === 'reload') { From 52a069cb54d27fc596a5f38f81244dde074d1015 Mon Sep 17 00:00:00 2001 From: eduardo naufel schettino Date: Wed, 11 Oct 2017 13:50:29 +0200 Subject: [PATCH 03/38] Fix bug in dev-server when a proxyTable entry is a string (#965) `options` can not be a `const` because it is modified if value is a string. --- template/build/dev-server.js | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/template/build/dev-server.js b/template/build/dev-server.js index 4c66d4dba9..00d9efd144 100644 --- a/template/build/dev-server.js +++ b/template/build/dev-server.js @@ -51,7 +51,7 @@ app.use(hotMiddleware) // proxy api requests Object.keys(proxyTable).forEach(function (context) { - const options = proxyTable[context] + let options = proxyTable[context] if (typeof options === 'string') { options = { target: options } } From 9befbfc28aea7e1313dc2418c78c58ed12aaeeee Mon Sep 17 00:00:00 2001 From: =?UTF-8?q?Thorsten=20L=C3=BCnborg?= Date: Sat, 14 Oct 2017 16:09:56 +0200 Subject: [PATCH 04/38] Fix casing --- template/src/App.vue | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/template/src/App.vue b/template/src/App.vue index 2ef72e8cbc..07f5be83da 100644 --- a/template/src/App.vue +++ b/template/src/App.vue @@ -2,7 +2,7 @@
{{#router}} - + {{else}} {{/router}} From b6a4694853899b8848b168fe190baf8f06f76a3d Mon Sep 17 00:00:00 2001 From: =?UTF-8?q?Thorsten=20L=C3=BCnborg?= Date: Sat, 14 Oct 2017 17:31:31 +0200 Subject: [PATCH 05/38] Revert 9befbfc --- template/src/App.vue | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/template/src/App.vue b/template/src/App.vue index 07f5be83da..2ef72e8cbc 100644 --- a/template/src/App.vue +++ b/template/src/App.vue @@ -2,7 +2,7 @@
{{#router}} - + {{else}} {{/router}} From 1a247415bde030ac94860db76efd3478198a5bed Mon Sep 17 00:00:00 2001 From: Ffloriel Date: Mon, 16 Oct 2017 08:59:55 +0100 Subject: [PATCH 06/38] update to vue and vue-router latest version (#984) - vue 2.5 - vue-router 3.0 --- template/package.json | 4 ++-- 1 file changed, 2 insertions(+), 2 deletions(-) diff --git a/template/package.json b/template/package.json index 86921c4fa4..8642434dc4 100644 --- a/template/package.json +++ b/template/package.json @@ -14,8 +14,8 @@ "lint": "eslint --ext .js,.vue src{{#unit}} test/unit/specs{{/unit}}{{#e2e}} test/e2e/specs{{/e2e}}"{{/lint}} }, "dependencies": { - "vue": "^2.4.2"{{#router}}, - "vue-router": "^2.7.0"{{/router}} + "vue": "^2.5.2"{{#router}}, + "vue-router": "^3.0.1"{{/router}} }, "devDependencies": { "autoprefixer": "^7.1.2", From 7cddb2126aae7a5927b1a937225b01cfb695f3dc Mon Sep 17 00:00:00 2001 From: =?UTF-8?q?Thorsten=20L=C3=BCnborg?= Date: Mon, 16 Oct 2017 13:15:26 +0200 Subject: [PATCH 07/38] fix missing dependency updates for * vue-template compiler * vue-loader --- template/package.json | 4 ++-- 1 file changed, 2 insertions(+), 2 deletions(-) diff --git a/template/package.json b/template/package.json index 8642434dc4..7df054108d 100644 --- a/template/package.json +++ b/template/package.json @@ -90,9 +90,9 @@ "ora": "^1.2.0", "rimraf": "^2.6.0", "url-loader": "^0.5.8", - "vue-loader": "^13.0.4", + "vue-loader": "^13.3.0", "vue-style-loader": "^3.0.1", - "vue-template-compiler": "^2.4.2", + "vue-template-compiler": "^2.5.2", "portfinder": "^1.0.13", "webpack": "^3.6.0", "webpack-dev-middleware": "^1.12.0", From 476a6b84c7882889171355aa4ce83c5871aeadce Mon Sep 17 00:00:00 2001 From: =?UTF-8?q?Thorsten=20L=C3=BCnborg?= Date: Mon, 16 Oct 2017 13:15:48 +0200 Subject: [PATCH 08/38] bump version string --- template/config/index.js | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/template/config/index.js b/template/config/index.js index 0bc0b6a7a6..14972462cc 100644 --- a/template/config/index.js +++ b/template/config/index.js @@ -1,5 +1,5 @@ 'use strict' -// Template version: 1.1.1 +// Template version: 1.1.3 // see http://vuejs-templates.github.io/webpack for documentation. const path = require('path') From b196679908eff9d4417a5328ce342d6052af8ed6 Mon Sep 17 00:00:00 2001 From: Ruslan Gunawardana Date: Mon, 16 Oct 2017 22:57:15 +0300 Subject: [PATCH 09/38] Ignore files improvements (#953) * .eslintignore covers paths that contain generated *.js files * .gitignore doesn't ignore unnecassary paths * root .js files are added to ESLint ignore list --- template/.eslintignore | 9 +++++++-- template/.gitignore | 6 +++--- 2 files changed, 10 insertions(+), 5 deletions(-) diff --git a/template/.eslintignore b/template/.eslintignore index 34af3774f3..ef5bd37d05 100644 --- a/template/.eslintignore +++ b/template/.eslintignore @@ -1,2 +1,7 @@ -build/*.js -config/*.js +/build/ +/config/ +/dist/ +/*.js +{{#unit}} +/test/unit/coverage/ +{{/unit}} diff --git a/template/.gitignore b/template/.gitignore index 5b21371edc..c80b682e18 100644 --- a/template/.gitignore +++ b/template/.gitignore @@ -1,14 +1,14 @@ .DS_Store node_modules/ -dist/ +/dist/ npm-debug.log* yarn-debug.log* yarn-error.log* {{#unit}} -test/unit/coverage +/test/unit/coverage/ {{/unit}} {{#e2e}} -test/e2e/reports +/test/e2e/reports/ selenium-debug.log {{/e2e}} From 937ebe69d54f92482a8f3a728d7506bc6aeef072 Mon Sep 17 00:00:00 2001 From: Tyler Peterson Date: Mon, 16 Oct 2017 13:57:50 -0600 Subject: [PATCH 10/38] Use multi-process parallel running and file cache to improve the build speed (#941) --- template/build/webpack.prod.conf.js | 3 ++- 1 file changed, 2 insertions(+), 1 deletion(-) diff --git a/template/build/webpack.prod.conf.js b/template/build/webpack.prod.conf.js index 1b91741c2d..07e477bd82 100644 --- a/template/build/webpack.prod.conf.js +++ b/template/build/webpack.prod.conf.js @@ -37,7 +37,8 @@ const webpackConfig = merge(baseWebpackConfig, { compress: { warnings: false }, - sourceMap: true + sourceMap: true, + parallel: true }), // extract css into its own file new ExtractTextPlugin({ From 6994826e9be57bb8b50e492b621cfdcc4f1998b8 Mon Sep 17 00:00:00 2001 From: Emanuele Date: Mon, 30 Oct 2017 13:32:13 +0000 Subject: [PATCH 11/38] Updated standard package URL (#1012) --- meta.js | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/meta.js b/meta.js index e2e2fdffa1..45d3acfb03 100644 --- a/meta.js +++ b/meta.js @@ -54,7 +54,7 @@ module.exports = { "message": "Pick an ESLint preset", "choices": [ { - "name": "Standard (https://github.com/feross/standard)", + "name": "Standard (https://github.com/standard/standard)", "value": "standard", "short": "Standard" }, From d223cd822300092fc156d7dbb731aaffce795f0d Mon Sep 17 00:00:00 2001 From: =?UTF-8?q?=E8=96=9B=E5=AE=9A=E8=B0=94=E7=9A=84=E7=8C=AB?= Date: Mon, 30 Oct 2017 21:37:38 +0800 Subject: [PATCH 12/38] Update: add meta viewport. (#983) --- template/index.html | 1 + 1 file changed, 1 insertion(+) diff --git a/template/index.html b/template/index.html index 60edbcf0d2..6cfaafc7a8 100644 --- a/template/index.html +++ b/template/index.html @@ -2,6 +2,7 @@ + {{ name }} From 0c52d3519e6e0b32dc1686e236663af7336bc31c Mon Sep 17 00:00:00 2001 From: =?UTF-8?q?Ren=C3=A9=20Herrmann?= Date: Mon, 30 Oct 2017 14:37:51 +0100 Subject: [PATCH 13/38] Ignore test folder (#991) --- .gitignore | 1 + 1 file changed, 1 insertion(+) diff --git a/.gitignore b/.gitignore index 80c45fbf35..a427247e75 100644 --- a/.gitignore +++ b/.gitignore @@ -1,3 +1,4 @@ node_modules .DS_Store docs/_book +test \ No newline at end of file From cf408f24bbbccdf374fef9d7a5bf4af5fae8a21c Mon Sep 17 00:00:00 2001 From: =?UTF-8?q?L=C2=B7Lawliet?= <553867163@qq.com> Date: Wed, 1 Nov 2017 19:51:52 +0800 Subject: [PATCH 14/38] fix the config contradiction (#1014) --- template/build/webpack.prod.conf.js | 6 +++--- 1 file changed, 3 insertions(+), 3 deletions(-) diff --git a/template/build/webpack.prod.conf.js b/template/build/webpack.prod.conf.js index 07e477bd82..a01b4454a2 100644 --- a/template/build/webpack.prod.conf.js +++ b/template/build/webpack.prod.conf.js @@ -47,9 +47,9 @@ const webpackConfig = merge(baseWebpackConfig, { // Compress extracted CSS. We are using this plugin so that possible // duplicated CSS from different components can be deduped. new OptimizeCSSPlugin({ - cssProcessorOptions: { - safe: true - } + cssProcessorOptions: config.build.productionSourceMap + ? { safe: true, map: { inline: false } } + : { safe: true } }), // generate dist index.html with correct asset hash for caching. // you can customize output by editing /index.html From 89c6fb18d4640afd6a5e89106b2493b4465d36a3 Mon Sep 17 00:00:00 2001 From: kazuya kawaguchi Date: Fri, 3 Nov 2017 00:18:35 +0900 Subject: [PATCH 15/38] docs(e2e): fix configration link (#1024) --- docs/e2e.md | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/docs/e2e.md b/docs/e2e.md index 1525fa4854..2c2f17341d 100644 --- a/docs/e2e.md +++ b/docs/e2e.md @@ -10,7 +10,7 @@ Let's take a look at the files in the `test/e2e` directory: - `nightwatch.conf.js` - Nightwatch configuration file. See [Nightwatch's docs on configuration](http://nightwatchjs.org/guide#settings-file) for more details. + Nightwatch configuration file. See [Nightwatch's docs on configuration](http://nightwatchjs.org/gettingstarted#settings-file) for more details. - `custom-assertions/` From aba0f9c7b7903a5371469ecbd80b6f7df93fe536 Mon Sep 17 00:00:00 2001 From: =?UTF-8?q?Thorsten=20L=C3=BCnborg?= Date: Wed, 8 Nov 2017 21:24:44 +0100 Subject: [PATCH 16/38] Switch to webpack-dev-server (close #964) (#975) * Finished testable version. * close #960 * fix node-notifier version * remove console.log * moved general dependency out of unit test-only dependency block. * fix typo * ignore /test folder * make HMR work correctly. * improve console messages for HMR - now show filenames of replaced modules. * fix typo in eslint-loader config * move imports for the env files from /config/index.js directly into the webpack config. Reasoning: thosen file imports are not configuration, so they don't belong inside of config/index.js * fix wrong overlay config --- .gitignore | 2 +- template/build/dev-client.js | 10 --- template/build/dev-server.js | 107 ---------------------------- template/build/logo.png | Bin 0 -> 6849 bytes template/build/utils.js | 20 ++++++ template/build/webpack.base.conf.js | 7 +- template/build/webpack.dev.conf.js | 58 ++++++++++++--- template/build/webpack.prod.conf.js | 2 +- template/config/index.js | 51 +++++++++---- template/package.json | 10 +-- template/test/e2e/runner.js | 25 +++++-- 11 files changed, 134 insertions(+), 158 deletions(-) delete mode 100644 template/build/dev-client.js delete mode 100644 template/build/dev-server.js create mode 100644 template/build/logo.png diff --git a/.gitignore b/.gitignore index a427247e75..38e1975447 100644 --- a/.gitignore +++ b/.gitignore @@ -1,4 +1,4 @@ node_modules .DS_Store docs/_book -test \ No newline at end of file +test/ diff --git a/template/build/dev-client.js b/template/build/dev-client.js deleted file mode 100644 index 2f75dd531f..0000000000 --- a/template/build/dev-client.js +++ /dev/null @@ -1,10 +0,0 @@ -/* eslint-disable */ -'use strict' -require('eventsource-polyfill') -var hotClient = require('webpack-hot-middleware/client?noInfo=true&reload=true') - -hotClient.subscribe(function (event) { - if (event.action === 'reload') { - window.location.reload() - } -}) diff --git a/template/build/dev-server.js b/template/build/dev-server.js deleted file mode 100644 index 00d9efd144..0000000000 --- a/template/build/dev-server.js +++ /dev/null @@ -1,107 +0,0 @@ -'use strict' -require('./check-versions')() - -const config = require('../config') -if (!process.env.NODE_ENV) { - process.env.NODE_ENV = JSON.parse(config.dev.env.NODE_ENV) -} - -const opn = require('opn') -const path = require('path') -const express = require('express') -const webpack = require('webpack') -const proxyMiddleware = require('http-proxy-middleware') -const webpackConfig = {{#if_or unit e2e}}(process.env.NODE_ENV === 'testing' || process.env.NODE_ENV === 'production') - ? require('./webpack.prod.conf') - : {{/if_or}}require('./webpack.dev.conf') - -// default port where dev server listens for incoming traffic -const port = process.env.PORT || config.dev.port -// automatically open browser, if not set will be false -const autoOpenBrowser = !!config.dev.autoOpenBrowser -// Define HTTP proxies to your custom API backend -// https://github.com/chimurai/http-proxy-middleware -const proxyTable = config.dev.proxyTable - -const app = express() -const compiler = webpack(webpackConfig) - -const devMiddleware = require('webpack-dev-middleware')(compiler, { - publicPath: webpackConfig.output.publicPath, - quiet: true -}) - -const hotMiddleware = require('webpack-hot-middleware')(compiler, { - log: false, - heartbeat: 2000 -}) -// force page reload when html-webpack-plugin template changes -// currently disabled until this is resolved: -// https://github.com/jantimon/html-webpack-plugin/issues/680 -// compiler.plugin('compilation', function (compilation) { -// compilation.plugin('html-webpack-plugin-after-emit', function (data, cb) { -// hotMiddleware.publish({ action: 'reload' }) -// cb() -// }) -// }) - -// enable hot-reload and state-preserving -// compilation error display -app.use(hotMiddleware) - -// proxy api requests -Object.keys(proxyTable).forEach(function (context) { - let options = proxyTable[context] - if (typeof options === 'string') { - options = { target: options } - } - app.use(proxyMiddleware(options.filter || context, options)) -}) - -// handle fallback for HTML5 history API -app.use(require('connect-history-api-fallback')()) - -// serve webpack bundle output -app.use(devMiddleware) - -// serve pure static assets -const staticPath = path.posix.join(config.dev.assetsPublicPath, config.dev.assetsSubDirectory) -app.use(staticPath, express.static('./static')) - -const uri = 'http://localhost:' + port - -var _resolve -var _reject -var readyPromise = new Promise((resolve, reject) => { - _resolve = resolve - _reject = reject -}) - -var server -var portfinder = require('portfinder') -portfinder.basePort = port - -console.log('> Starting dev server...') -devMiddleware.waitUntilValid(() => { - portfinder.getPort((err, port) => { - if (err) { - _reject(err) - } - process.env.PORT = port - var uri = 'http://localhost:' + port - console.log('> Listening at ' + uri + '\n') - // when env is testing, don't need open it - if (autoOpenBrowser && process.env.NODE_ENV !== 'testing') { - opn(uri) - } - server = app.listen(port) - _resolve() - }) -}) - -module.exports = { - ready: readyPromise, - close: () => { - server.close() - } -} diff --git a/template/build/logo.png b/template/build/logo.png new file mode 100644 index 0000000000000000000000000000000000000000..f3d2503fc2a44b5053b0837ebea6e87a2d339a43 GIT binary patch literal 6849 zcmaKRcUV(fvo}bjDT-7nLI_nlK}sT_69H+`qzVWDA|yaU?}j417wLi^B1KB1SLsC& zL0ag7$U(XW5YR7p&Ux?sP$d4lvMt8C^+TcQu4F zQqv!UF!I+kw)c0jhd6+g6oCr9P?7)?!qX1ui*iL{p}sKCAGuJ{{W)0z1pLF|=>h}& zt(2Lr0Z`2ig8<5i%Zk}cO5Fm=LByqGWaS`oqChZdEFmc`0hSb#gg|Aap^{+WKOYcj zHjINK)KDG%&s?Mt4CL(T=?;~U@bU2x_mLKN!#GJuK_CzbNw5SMEJorG!}_5;?R>@1 zSl)jns3WlU7^J%=(hUtfmuUCU&C3%8B5C^f5>W2Cy8jW3#{Od{lF1}|?c61##3dzA zsPlFG;l_FzBK}8>|H_Ru_H#!_7$UH4UKo3lKOA}g1(R&|e@}GINYVzX?q=_WLZCgh z)L|eJMce`D0EIwgRaNETDsr+?vQknSGAi=7H00r`QnI%oQnFxm`G2umXso9l+8*&Q z7WqF|$p49js$mdzo^BXpH#gURy=UO;=IMrYc5?@+sR4y_?d*~0^YP7d+y0{}0)zBM zIKVM(DBvICK#~7N0a+PY6)7;u=dutmNqK3AlsrUU9U`d;msiucB_|8|2kY=(7XA;G zwDA8AR)VCA#JOkxm#6oHNS^YVuOU;8p$N)2{`;oF|rQ?B~K$%rHDxXs+_G zF5|-uqHZvSzq}L;5Kcy_P+x0${33}Ofb6+TX&=y;;PkEOpz%+_bCw_{<&~ zeLV|!bP%l1qxywfVr9Z9JI+++EO^x>ZuCK);=$VIG1`kxK8F2M8AdC$iOe3cj1fo(ce4l-9 z7*zKy3={MixvUk=enQE;ED~7tv%qh&3lR<0m??@w{ILF|e#QOyPkFYK!&Up7xWNtL zOW%1QMC<3o;G9_S1;NkPB6bqbCOjeztEc6TsBM<(q9((JKiH{01+Ud=uw9B@{;(JJ z-DxI2*{pMq`q1RQc;V8@gYAY44Z!%#W~M9pRxI(R?SJ7sy7em=Z5DbuDlr@*q|25V)($-f}9c#?D%dU^RS<(wz?{P zFFHtCab*!rl(~j@0(Nadvwg8q|4!}L^>d?0al6}Rrv9$0M#^&@zjbfJy_n!%mVHK4 z6pLRIQ^Uq~dnyy$`ay51Us6WaP%&O;@49m&{G3z7xV3dLtt1VTOMYl3UW~Rm{Eq4m zF?Zl_v;?7EFx1_+#WFUXxcK78IV)FO>42@cm@}2I%pVbZqQ}3;p;sDIm&knay03a^ zn$5}Q$G!@fTwD$e(x-~aWP0h+4NRz$KlnO_H2c< z(XX#lPuW_%H#Q+c&(nRyX1-IadKR-%$4FYC0fsCmL9ky3 zKpxyjd^JFR+vg2!=HWf}2Z?@Td`0EG`kU?{8zKrvtsm)|7>pPk9nu@2^z96aU2<#` z2QhvH5w&V;wER?mopu+nqu*n8p~(%QkwSs&*0eJwa zMXR05`OSFpfyRb!Y_+H@O%Y z0=K^y6B8Gcbl?SA)qMP3Z+=C(?8zL@=74R=EVnE?vY!1BQy2@q*RUgRx4yJ$k}MnL zs!?74QciNb-LcG*&o<9=DSL>1n}ZNd)w1z3-0Pd^4ED1{qd=9|!!N?xnXjM!EuylY z5=!H>&hSofh8V?Jofyd!h`xDI1fYAuV(sZwwN~{$a}MX^=+0TH*SFp$vyxmUv7C*W zv^3Gl0+eTFgBi3FVD;$nhcp)ka*4gSskYIqQ&+M}xP9yLAkWzBI^I%zR^l1e?bW_6 zIn{mo{dD=)9@V?s^fa55jh78rP*Ze<3`tRCN4*mpO$@7a^*2B*7N_|A(Ve2VB|)_o z$=#_=aBkhe(ifX}MLT()@5?OV+~7cXC3r!%{QJxriXo9I%*3q4KT4Xxzyd{ z9;_%=W%q!Vw$Z7F3lUnY+1HZ*lO;4;VR2+i4+D(m#01OYq|L_fbnT;KN<^dkkCwtd zF7n+O7KvAw8c`JUh6LmeIrk4`F3o|AagKSMK3))_5Cv~y2Bb2!Ibg9BO7Vkz?pAYX zoI=B}+$R22&IL`NCYUYjrdhwjnMx_v=-Qcx-jmtN>!Zqf|n1^SWrHy zK|MwJ?Z#^>)rfT5YSY{qjZ&`Fjd;^vv&gF-Yj6$9-Dy$<6zeP4s+78gS2|t%Z309b z0^fp~ue_}i`U9j!<|qF92_3oB09NqgAoehQ`)<)dSfKoJl_A6Ec#*Mx9Cpd-p#$Ez z={AM*r-bQs6*z$!*VA4|QE7bf@-4vb?Q+pPKLkY2{yKsw{&udv_2v8{Dbd zm~8VAv!G~s)`O3|Q6vFUV%8%+?ZSVUa(;fhPNg#vab@J*9XE4#D%)$UU-T5`fwjz! z6&gA^`OGu6aUk{l*h9eB?opVdrHK>Q@U>&JQ_2pR%}TyOXGq_6s56_`U(WoOaAb+K zXQr#6H}>a-GYs9^bGP2Y&hSP5gEtW+GVC4=wy0wQk=~%CSXj=GH6q z-T#s!BV`xZVxm{~jr_ezYRpqqIcXC=Oq`b{lu`Rt(IYr4B91hhVC?yg{ol4WUr3v9 zOAk2LG>CIECZ-WIs0$N}F#eoIUEtZudc7DPYIjzGqDLWk_A4#(LgacooD z2K4IWs@N`Bddm-{%oy}!k0^i6Yh)uJ1S*90>|bm3TOZxcV|ywHUb(+CeX-o1|LTZM zwU>dY3R&U)T(}5#Neh?-CWT~@{6Ke@sI)uSuzoah8COy)w)B)aslJmp`WUcjdia-0 zl2Y}&L~XfA`uYQboAJ1;J{XLhYjH){cObH3FDva+^8ioOQy%Z=xyjGLmWMrzfFoH; zEi3AG`_v+%)&lDJE;iJWJDI@-X9K5O)LD~j*PBe(wu+|%ar~C+LK1+-+lK=t# z+Xc+J7qp~5q=B~rD!x78)?1+KUIbYr^5rcl&tB-cTtj+e%{gpZZ4G~6r15+d|J(ky zjg@@UzMW0k9@S#W(1H{u;Nq(7llJbq;;4t$awM;l&(2s+$l!Ay9^Ge|34CVhr7|BG z?dAR83smef^frq9V(OH+a+ki#q&-7TkWfFM=5bsGbU(8mC;>QTCWL5ydz9s6k@?+V zcjiH`VI=59P-(-DWXZ~5DH>B^_H~;4$)KUhnmGo*G!Tq8^LjfUDO)lASN*=#AY_yS zqW9UX(VOCO&p@kHdUUgsBO0KhXxn1sprK5h8}+>IhX(nSXZKwlNsjk^M|RAaqmCZB zHBolOHYBas@&{PT=R+?d8pZu zUHfyucQ`(umXSW7o?HQ3H21M`ZJal+%*)SH1B1j6rxTlG3hx1IGJN^M7{$j(9V;MZ zRKybgVuxKo#XVM+?*yTy{W+XHaU5Jbt-UG33x{u(N-2wmw;zzPH&4DE103HV@ER86 z|FZEmQb|&1s5#`$4!Cm}&`^{(4V}OP$bk`}v6q6rm;P!H)W|2i^e{7lTk2W@jo_9q z*aw|U7#+g59Fv(5qI`#O-qPj#@_P>PC#I(GSp3DLv7x-dmYK=C7lPF8a)bxb=@)B1 zUZ`EqpXV2dR}B&r`uM}N(TS99ZT0UB%IN|0H%DcVO#T%L_chrgn#m6%x4KE*IMfjX zJ%4veCEqbXZ`H`F_+fELMC@wuy_ch%t*+Z+1I}wN#C+dRrf2X{1C8=yZ_%Pt6wL_~ zZ2NN-hXOT4P4n$QFO7yYHS-4wF1Xfr-meG9Pn;uK51?hfel`d38k{W)F*|gJLT2#T z<~>spMu4(mul-8Q3*pf=N4DcI)zzjqAgbE2eOT7~&f1W3VsdD44Ffe;3mJp-V@8UC z)|qnPc12o~$X-+U@L_lWqv-RtvB~%hLF($%Ew5w>^NR82qC_0FB z)=hP1-OEx?lLi#jnLzH}a;Nvr@JDO-zQWd}#k^an$Kwml;MrD&)sC5b`s0ZkVyPkb zt}-jOq^%_9>YZe7Y}PhW{a)c39G`kg(P4@kxjcYfgB4XOOcmezdUI7j-!gs7oAo2o zx(Ph{G+YZ`a%~kzK!HTAA5NXE-7vOFRr5oqY$rH>WI6SFvWmahFav!CfRMM3%8J&c z*p+%|-fNS_@QrFr(at!JY9jCg9F-%5{nb5Bo~z@Y9m&SHYV`49GAJjA5h~h4(G!Se zZmK{Bo7ivCfvl}@A-ptkFGcWXAzj3xfl{evi-OG(TaCn1FAHxRc{}B|x+Ua1D=I6M z!C^ZIvK6aS_c&(=OQDZfm>O`Nxsw{ta&yiYPA~@e#c%N>>#rq)k6Aru-qD4(D^v)y z*>Rs;YUbD1S8^D(ps6Jbj0K3wJw>L4m)0e(6Pee3Y?gy9i0^bZO?$*sv+xKV?WBlh zAp*;v6w!a8;A7sLB*g-^<$Z4L7|5jXxxP1}hQZ<55f9<^KJ>^mKlWSGaLcO0=$jem zWyZkRwe~u{{tU63DlCaS9$Y4CP4f?+wwa(&1ou)b>72ydrFvm`Rj-0`kBJgK@nd(*Eh!(NC{F-@=FnF&Y!q`7){YsLLHf0_B6aHc# z>WIuHTyJwIH{BJ4)2RtEauC7Yq7Cytc|S)4^*t8Va3HR zg=~sN^tp9re@w=GTx$;zOWMjcg-7X3Wk^N$n;&Kf1RgVG2}2L-(0o)54C509C&77i zrjSi{X*WV=%C17((N^6R4Ya*4#6s_L99RtQ>m(%#nQ#wrRC8Y%yxkH;d!MdY+Tw@r zjpSnK`;C-U{ATcgaxoEpP0Gf+tx);buOMlK=01D|J+ROu37qc*rD(w`#O=3*O*w9?biwNoq3WN1`&Wp8TvKj3C z3HR9ssH7a&Vr<6waJrU zdLg!ieYz%U^bmpn%;(V%%ugMk92&?_XX1K@mwnVSE6!&%P%Wdi7_h`CpScvspMx?N zQUR>oadnG17#hNc$pkTp+9lW+MBKHRZ~74XWUryd)4yd zj98$%XmIL4(9OnoeO5Fnyn&fpQ9b0h4e6EHHw*l68j;>(ya`g^S&y2{O8U>1*>4zR zq*WSI_2o$CHQ?x0!wl9bpx|Cm2+kFMR)oMud1%n2=qn5nE&t@Fgr#=Zv2?}wtEz^T z9rrj=?IH*qI5{G@Rn&}^Z{+TW}mQeb9=8b<_a`&Cm#n%n~ zU47MvCBsdXFB1+adOO)03+nczfWa#vwk#r{o{dF)QWya9v2nv43Zp3%Ps}($lA02*_g25t;|T{A5snSY?3A zrRQ~(Ygh_ebltHo1VCbJb*eOAr;4cnlXLvI>*$-#AVsGg6B1r7@;g^L zFlJ_th0vxO7;-opU@WAFe;<}?!2q?RBrFK5U{*ai@NLKZ^};Ul}beukveh?TQn;$%9=R+DX07m82gP$=}Uo_%&ngV`}Hyv8g{u z3SWzTGV|cwQuFIs7ZDOqO_fGf8Q`8MwL}eUp>q?4eqCmOTcwQuXtQckPy|4F1on8l zP*h>d+cH#XQf|+6c|S{7SF(Lg>bR~l(0uY?O{OEVlaxa5@e%T&xju=o1`=OD#qc16 zSvyH*my(dcp6~VqR;o(#@m44Lug@~_qw+HA=mS#Z^4reBy8iV?H~I;{LQWk3aKK8$bLRyt$g?- { + if (severity !== 'error') { + return + } + const error = errors[0] + + const filename = error.file.split('!').pop() + notifier.notify({ + title: pkg.name, + message: severity + ': ' + error.name, + subtitle: filename || '', + icon: path.join(__dirname, 'logo.png') + }) + } +} diff --git a/template/build/webpack.base.conf.js b/template/build/webpack.base.conf.js index f0f56c5115..89931abb7c 100644 --- a/template/build/webpack.base.conf.js +++ b/template/build/webpack.base.conf.js @@ -31,15 +31,16 @@ module.exports = { module: { rules: [ {{#lint}} - { + ...(config.dev.useEslint? [{ test: /\.(js|vue)$/, loader: 'eslint-loader', enforce: 'pre', include: [resolve('src'), resolve('test')], options: { - formatter: require('eslint-friendly-formatter') + formatter: require('eslint-friendly-formatter'), + emitWarning: !config.dev.showEslintErrorsInOverlay } - }, + }] : []), {{/lint}} { test: /\.vue$/, diff --git a/template/build/webpack.dev.conf.js b/template/build/webpack.dev.conf.js index 6f25d63458..9b2429a5e1 100644 --- a/template/build/webpack.dev.conf.js +++ b/template/build/webpack.dev.conf.js @@ -6,24 +6,38 @@ const merge = require('webpack-merge') const baseWebpackConfig = require('./webpack.base.conf') const HtmlWebpackPlugin = require('html-webpack-plugin') const FriendlyErrorsPlugin = require('friendly-errors-webpack-plugin') +const portfinder = require('portfinder') -// add hot-reload related code to entry chunks -Object.keys(baseWebpackConfig.entry).forEach(function (name) { - baseWebpackConfig.entry[name] = ['./build/dev-client'].concat(baseWebpackConfig.entry[name]) -}) - -module.exports = merge(baseWebpackConfig, { +const devWebpackConfig = merge(baseWebpackConfig, { module: { rules: utils.styleLoaders({ sourceMap: config.dev.cssSourceMap }) }, // cheap-module-eval-source-map is faster for development devtool: '#cheap-module-eval-source-map', + + // these devServer options should be customized in /config/index.js + devServer: { + hot: true, + host: process.env.HOST || config.dev.host, + port: process.env.PORT || config.dev.port, + open: config.dev.autoOpenBrowser, + overlay: config.dev.errorOverlay ? { + warnings: false, + errors: true, + } : false, + publicPath: config.dev.assetsPublicPath, + proxy: config.dev.proxyTable, + quiet: true, // necessary for FriendlyErrorsPlugin + watchOptions: { + poll: config.dev.poll, + } + }, plugins: [ new webpack.DefinePlugin({ - 'process.env': config.dev.env - }), - // https://github.com/glenjamin/webpack-hot-middleware#installation--usage + '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({ @@ -34,3 +48,29 @@ module.exports = merge(baseWebpackConfig, { new FriendlyErrorsPlugin() ] }) + +module.exports = new Promise((resolve, reject) => { + portfinder.basePort = process.env.PORT || config.dev.port + portfinder.getPort((err, port) => { + if (err) { + reject(err) + } else { + // publish the new Port, necessary for e2e tests + process.env.PORT = port + // add port to devServer config + devWebpackConfig.devServer.port = port + + // Add FriendlyErrorsPlugin + devWebpackConfig.plugins.push(new FriendlyErrorsPlugin({ + compilationSuccessInfo: { + messages: [`Your application is running here: http://${config.dev.host}:${port}`], + }, + onErrors: config.dev.notifyOnErrors + ? utils.createNotifierCallback() + : undefined + })) + + resolve(devWebpackConfig) + } + }) +}) diff --git a/template/build/webpack.prod.conf.js b/template/build/webpack.prod.conf.js index a01b4454a2..0834cc12fb 100644 --- a/template/build/webpack.prod.conf.js +++ b/template/build/webpack.prod.conf.js @@ -12,7 +12,7 @@ const OptimizeCSSPlugin = require('optimize-css-assets-webpack-plugin') const env = {{#if_or unit e2e}}process.env.NODE_ENV === 'testing' ? require('../config/test.env') - : {{/if_or}}config.build.env + : {{/if_or}}require('../config/prod.env') const webpackConfig = merge(baseWebpackConfig, { module: { diff --git a/template/config/index.js b/template/config/index.js index 14972462cc..09eaac1859 100644 --- a/template/config/index.js +++ b/template/config/index.js @@ -5,37 +5,58 @@ const path = require('path') module.exports = { + dev: { + 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 + + // Paths + assetsSubDirectory: 'static', + assetsPublicPath: '/', + proxyTable: {}, + + // Various Dev Server settings + autoOpenBrowser: false, + errorOverlay: true, + notifyOnErrors: true, + poll: false, // https://webpack.js.org/configuration/dev-server/#devserver-watchoptions- + + // Use Eslint Loader? + // If true, your code will be linted during bundling and + // linting errors and warings will be shown in the console. + useEslint: true, + // If true, eslint errors and warings will also be shown in the error overlay + // in the browser. + showEslintErrorsInOverlay: false, + + // CSS Sourcemaps off by default because relative paths are "buggy" + // with this option, according to the CSS-Loader README + // (https://github.com/webpack/css-loader#sourcemaps) + // In our experience, they generally work as expected, + // just be aware of this issue when enabling this option. + cssSourceMap: false + }, build: { - env: require('./prod.env'), + // Template for index.html index: path.resolve(__dirname, '../dist/index.html'), + + // Paths assetsRoot: path.resolve(__dirname, '../dist'), assetsSubDirectory: 'static', assetsPublicPath: '/', + productionSourceMap: true, // 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` // Set to `true` or `false` to always turn it on or off + bundleAnalyzerReport: process.env.npm_config_report - }, - dev: { - env: require('./dev.env'), - port: process.env.PORT || 8080, - autoOpenBrowser: true, - assetsSubDirectory: 'static', - assetsPublicPath: '/', - proxyTable: {}, - // CSS Sourcemaps off by default because relative paths are "buggy" - // with this option, according to the CSS-Loader README - // (https://github.com/webpack/css-loader#sourcemaps) - // In our experience, they generally work as expected, - // just be aware of this issue when enabling this option. - cssSourceMap: false } } diff --git a/template/package.json b/template/package.json index 7df054108d..d2578a8363 100644 --- a/template/package.json +++ b/template/package.json @@ -5,7 +5,7 @@ "author": "{{ author }}", "private": true, "scripts": { - "dev": "node build/dev-server.js", + "dev": "webpack-dev-server --inline --progress --config build/webpack.dev.conf.js", "start": "npm run dev", "build": "node build/build.js"{{#unit}}, "unit": "cross-env BABEL_ENV=test karma start test/unit/karma.conf.js --single-run"{{/unit}}{{#e2e}}, @@ -29,7 +29,6 @@ "babel-preset-stage-2": "^6.22.0", "babel-register": "^6.22.0", "chalk": "^2.0.1", - "connect-history-api-fallback": "^1.3.0", "copy-webpack-plugin": "^4.0.1", "css-loader": "^0.28.0", {{#lint}} @@ -51,12 +50,10 @@ {{/if_eq}} {{/lint}} "eventsource-polyfill": "^0.9.6", - "express": "^4.14.1", "extract-text-webpack-plugin": "^3.0.0", "file-loader": "^1.1.4", "friendly-errors-webpack-plugin": "^1.6.1", "html-webpack-plugin": "^2.30.1", - "http-proxy-middleware": "^0.17.3", "webpack-bundle-analyzer": "^2.9.0", {{#unit}} "cross-env": "^5.0.1", @@ -77,6 +74,7 @@ "babel-plugin-istanbul": "^4.1.1", "phantomjs-prebuilt": "^2.1.14", {{/unit}} + "node-notifier": "^5.1.2", {{#e2e}} "chromedriver": "^2.27.2", "cross-spawn": "^5.0.1", @@ -85,7 +83,6 @@ {{/e2e}} "semver": "^5.3.0", "shelljs": "^0.7.6", - "opn": "^5.1.0", "optimize-css-assets-webpack-plugin": "^3.2.0", "ora": "^1.2.0", "rimraf": "^2.6.0", @@ -95,8 +92,7 @@ "vue-template-compiler": "^2.5.2", "portfinder": "^1.0.13", "webpack": "^3.6.0", - "webpack-dev-middleware": "^1.12.0", - "webpack-hot-middleware": "^2.18.2", + "webpack-dev-server": "^2.9.1", "webpack-merge": "^4.1.0" }, "engines": { diff --git a/template/test/e2e/runner.js b/template/test/e2e/runner.js index 6b30c61e17..de22bfda22 100644 --- a/template/test/e2e/runner.js +++ b/template/test/e2e/runner.js @@ -1,8 +1,23 @@ // 1. start the dev server using production config process.env.NODE_ENV = 'testing'{{#if_eq lintConfig "airbnb"}};{{/if_eq}} -var server = require('../../build/dev-server.js'){{#if_eq lintConfig "airbnb"}};{{/if_eq}} -server.ready.then(() => { +const webpack = require('webpack'){{#if_eq lintConfig "airbnb"}};{{/if_eq}} +const DevServer = require('webpack-dev-server'){{#if_eq lintConfig "airbnb"}};{{/if_eq}} + +const webpackConfig = require('../../build/webpack.prod.conf'){{#if_eq lintConfig "airbnb"}};{{/if_eq}} +const devConfigPromise = require('../../build/webpack.dev.conf'){{#if_eq lintConfig "airbnb"}};{{/if_eq}} + +let server{{#if_eq lintConfig "airbnb"}};{{/if_eq}} + +devConfigPromise.then(devConfig => { + const devServerOptions = devConfig.devServer{{#if_eq lintConfig "airbnb"}};{{/if_eq}} + const compiler = webpack(webpackConfig){{#if_eq lintConfig "airbnb"}};{{/if_eq}} + server = new DevServer(compiler, devServerOptions){{#if_eq lintConfig "airbnb"}};{{/if_eq}} + const port = devServerOptions.port{{#if_eq lintConfig "airbnb"}};{{/if_eq}} + const host = devServerOptions.host{{#if_eq lintConfig "airbnb"}};{{/if_eq}} + return server.listen(port, host){{#if_eq lintConfig "airbnb"}};{{/if_eq}} +}) +.then(() => { // 2. run the nightwatch test suite against it // to run in additional browsers: // 1. add an entry in test/e2e/nightwatch.conf.json under "test_settings" @@ -10,7 +25,7 @@ server.ready.then(() => { // or override the environment flag, for example: `npm run e2e -- --env chrome,firefox` // For more information on Nightwatch's config file, see // http://nightwatchjs.org/guide#settings-file - var opts = process.argv.slice(2){{#if_eq lintConfig "airbnb"}};{{/if_eq}} + let opts = process.argv.slice(2){{#if_eq lintConfig "airbnb"}};{{/if_eq}} if (opts.indexOf('--config') === -1) { opts = opts.concat(['--config', 'test/e2e/nightwatch.conf.js']){{#if_eq lintConfig "airbnb"}};{{/if_eq}} } @@ -18,8 +33,8 @@ server.ready.then(() => { opts = opts.concat(['--env', 'chrome']){{#if_eq lintConfig "airbnb"}};{{/if_eq}} } - var spawn = require('cross-spawn'){{#if_eq lintConfig "airbnb"}};{{/if_eq}} - var runner = spawn('./node_modules/.bin/nightwatch', opts, { stdio: 'inherit' }){{#if_eq lintConfig "airbnb"}};{{/if_eq}} + const spawn = require('cross-spawn'){{#if_eq lintConfig "airbnb"}};{{/if_eq}} + const runner = spawn('./node_modules/.bin/nightwatch', opts, { stdio: 'inherit' }){{#if_eq lintConfig "airbnb"}};{{/if_eq}} runner.on('exit', function (code) { server.close(){{#if_eq lintConfig "airbnb"}};{{/if_eq}} From 41cb81117487e756311950185dd3508117a15591 Mon Sep 17 00:00:00 2001 From: anubhav mishra Date: Thu, 9 Nov 2017 01:55:43 +0530 Subject: [PATCH 17/38] remove uneccessary target.browsers (#1004) options are already defined in package.json's "browserList" field. --- template/.babelrc | 5 +---- 1 file changed, 1 insertion(+), 4 deletions(-) diff --git a/template/.babelrc b/template/.babelrc index c06df4d53a..d0f20ff4e7 100644 --- a/template/.babelrc +++ b/template/.babelrc @@ -1,10 +1,7 @@ { "presets": [ ["env", { - "modules": false, - "targets": { - "browsers": ["> 1%", "last 2 versions", "not ie <= 8"] - } + "modules": false }], "stage-2" ], From 583b6bb2c5a4d06333aeddb98ec77c28869bdeab Mon Sep 17 00:00:00 2001 From: yibuyisheng Date: Thu, 9 Nov 2017 04:27:25 +0800 Subject: [PATCH 18/38] fix postcss config (#890) * Update vue-loader link (#886) * Merge some small fixes (#900) * Remove unused fs require from webpack.base.conf.js (#893) * cleanup some leftover from reverting #688 * fix postcss config * userPostCSS config --- template/build/utils.js | 6 +++++- template/build/webpack.dev.conf.js | 2 +- template/build/webpack.prod.conf.js | 3 ++- 3 files changed, 8 insertions(+), 3 deletions(-) diff --git a/template/build/utils.js b/template/build/utils.js index b75c21502f..a66d1d4ca7 100644 --- a/template/build/utils.js +++ b/template/build/utils.js @@ -22,9 +22,13 @@ exports.cssLoaders = function (options) { } } + var postcssLoader = { + loader: 'postcss-loader' + } + // generate loader string to be used with extract text plugin function generateLoaders (loader, loaderOptions) { - const loaders = [cssLoader] + const loaders = options.usePostCSS !== false ? [cssLoader, postcssLoader] : [cssLoader] if (loader) { loaders.push({ loader: loader + '-loader', diff --git a/template/build/webpack.dev.conf.js b/template/build/webpack.dev.conf.js index 9b2429a5e1..1183918be9 100644 --- a/template/build/webpack.dev.conf.js +++ b/template/build/webpack.dev.conf.js @@ -10,7 +10,7 @@ const portfinder = require('portfinder') const devWebpackConfig = merge(baseWebpackConfig, { module: { - rules: utils.styleLoaders({ sourceMap: config.dev.cssSourceMap }) + rules: utils.styleLoaders({ sourceMap: config.dev.cssSourceMap, usePostCSS: true }) }, // cheap-module-eval-source-map is faster for development devtool: '#cheap-module-eval-source-map', diff --git a/template/build/webpack.prod.conf.js b/template/build/webpack.prod.conf.js index 0834cc12fb..bf8ae1bc35 100644 --- a/template/build/webpack.prod.conf.js +++ b/template/build/webpack.prod.conf.js @@ -18,7 +18,8 @@ const webpackConfig = merge(baseWebpackConfig, { module: { rules: utils.styleLoaders({ sourceMap: config.build.productionSourceMap, - extract: true + extract: true, + usePostCSS: true }) }, devtool: config.build.productionSourceMap ? '#source-map' : false, From 883442b1f0d272b7a0592022fc7875d113ad2dbe Mon Sep 17 00:00:00 2001 From: Sid Date: Thu, 9 Nov 2017 04:30:13 +0800 Subject: [PATCH 19/38] replace `id` with `name` in chunk files, Fix #996 (#997) --- template/build/webpack.prod.conf.js | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/template/build/webpack.prod.conf.js b/template/build/webpack.prod.conf.js index bf8ae1bc35..1528eda913 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/[id].[chunkhash].js') + chunkFilename: utils.assetsPath('js/[name].[chunkhash].js') }, plugins: [ // http://vuejs.github.io/vue-loader/en/workflow/production.html From f1d323b6e6840cf8f9c44cd894649ab82d0fea63 Mon Sep 17 00:00:00 2001 From: Agniva De Sarker Date: Thu, 9 Nov 2017 02:00:40 +0530 Subject: [PATCH 20/38] Add scope hoisting in the prod config (#1013) https://medium.com/webpack/brief-introduction-to-scope-hoisting-in-webpack-8435084c171f --- template/build/webpack.prod.conf.js | 2 ++ 1 file changed, 2 insertions(+) diff --git a/template/build/webpack.prod.conf.js b/template/build/webpack.prod.conf.js index 1528eda913..958c130abc 100644 --- a/template/build/webpack.prod.conf.js +++ b/template/build/webpack.prod.conf.js @@ -73,6 +73,8 @@ const webpackConfig = merge(baseWebpackConfig, { }), // keep module.id stable when vender modules does not change new webpack.HashedModuleIdsPlugin(), + // enable scope hoisting + new webpack.optimize.ModuleConcatenationPlugin(), // split vendor js into its own file new webpack.optimize.CommonsChunkPlugin({ name: 'vendor', From 844c8dded173f1e9ca15f8e42cd6f8c1528c2055 Mon Sep 17 00:00:00 2001 From: =?UTF-8?q?=E8=8A=B1=E8=A3=A4=E8=A1=A9?= Date: Fri, 10 Nov 2017 02:15:57 -0600 Subject: [PATCH 21/38] Add postcss-loader (#1038) --- template/package.json | 1 + 1 file changed, 1 insertion(+) diff --git a/template/package.json b/template/package.json index d2578a8363..64e165d3f6 100644 --- a/template/package.json +++ b/template/package.json @@ -85,6 +85,7 @@ "shelljs": "^0.7.6", "optimize-css-assets-webpack-plugin": "^3.2.0", "ora": "^1.2.0", + "postcss-loader": "^2.0.8", "rimraf": "^2.6.0", "url-loader": "^0.5.8", "vue-loader": "^13.3.0", From 507819912bed26409e83200e863bf7fde64501da Mon Sep 17 00:00:00 2001 From: Thorsten Date: Sat, 11 Nov 2017 13:54:19 +0100 Subject: [PATCH 22/38] add cacheBusting option for vue-loader --- template/config/index.js | 7 ++++++- 1 file changed, 6 insertions(+), 1 deletion(-) diff --git a/template/config/index.js b/template/config/index.js index 09eaac1859..0a7260bb2f 100644 --- a/template/config/index.js +++ b/template/config/index.js @@ -33,7 +33,12 @@ module.exports = { // (https://github.com/webpack/css-loader#sourcemaps) // In our experience, they generally work as expected, // just be aware of this issue when enabling this option. - cssSourceMap: false + cssSourceMap: false, + + // If you have problems debugging vue-files in devtools, + // set this to false - it *may* help + // https://vue-loader.vuejs.org/en/options.html#cachebusting + cacheBusting: true, }, build: { // Template for index.html From 5b5909502f62e8b54f216bc03f65c315f373bf81 Mon Sep 17 00:00:00 2001 From: Thorsten Date: Sat, 11 Nov 2017 13:54:56 +0100 Subject: [PATCH 23/38] make sourcemaps editable in config also reorganize the config file a bit. --- template/build/webpack.dev.conf.js | 2 +- template/build/webpack.prod.conf.js | 4 ++-- template/config/index.js | 33 ++++++++++++++++++++--------- 3 files changed, 26 insertions(+), 13 deletions(-) diff --git a/template/build/webpack.dev.conf.js b/template/build/webpack.dev.conf.js index 1183918be9..e47767d6fd 100644 --- a/template/build/webpack.dev.conf.js +++ b/template/build/webpack.dev.conf.js @@ -13,7 +13,7 @@ const devWebpackConfig = merge(baseWebpackConfig, { rules: utils.styleLoaders({ sourceMap: config.dev.cssSourceMap, usePostCSS: true }) }, // cheap-module-eval-source-map is faster for development - devtool: '#cheap-module-eval-source-map', + devtool: config.dev.devtool, // these devServer options should be customized in /config/index.js devServer: { diff --git a/template/build/webpack.prod.conf.js b/template/build/webpack.prod.conf.js index 958c130abc..19cfe25ced 100644 --- a/template/build/webpack.prod.conf.js +++ b/template/build/webpack.prod.conf.js @@ -22,7 +22,7 @@ const webpackConfig = merge(baseWebpackConfig, { usePostCSS: true }) }, - devtool: config.build.productionSourceMap ? '#source-map' : false, + devtool: config.build.productionSourceMap ? config.build.devtool : false, output: { path: config.build.assetsRoot, filename: utils.assetsPath('js/[name].[chunkhash].js'), @@ -38,7 +38,7 @@ const webpackConfig = merge(baseWebpackConfig, { compress: { warnings: false }, - sourceMap: true, + sourceMap: config.build.productionSourceMap, parallel: true }), // extract css into its own file diff --git a/template/config/index.js b/template/config/index.js index 0a7260bb2f..a61e95b59d 100644 --- a/template/config/index.js +++ b/template/config/index.js @@ -6,8 +6,6 @@ const path = require('path') module.exports = { dev: { - 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 // Paths assetsSubDirectory: 'static', @@ -15,6 +13,8 @@ module.exports = { proxyTable: {}, // 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 autoOpenBrowser: false, errorOverlay: true, notifyOnErrors: true, @@ -28,18 +28,26 @@ module.exports = { // in the browser. showEslintErrorsInOverlay: false, - // CSS Sourcemaps off by default because relative paths are "buggy" - // with this option, according to the CSS-Loader README - // (https://github.com/webpack/css-loader#sourcemaps) - // In our experience, they generally work as expected, - // just be aware of this issue when enabling this option. - cssSourceMap: false, + /** + * Source Maps + */ + + // https://webpack.js.org/configuration/devtool/#development + devtool: 'eval-source-map', // If you have problems debugging vue-files in devtools, // set this to false - it *may* help // https://vue-loader.vuejs.org/en/options.html#cachebusting cacheBusting: true, + + // CSS Sourcemaps off by default because relative paths are "buggy" + // with this option, according to the CSS-Loader README + // (https://github.com/webpack/css-loader#sourcemaps) + // In our experience, they generally work as expected, + // just be aware of this issue when enabling this option. + cssSourceMap: false, }, + build: { // Template for index.html index: path.resolve(__dirname, '../dist/index.html'), @@ -49,19 +57,24 @@ module.exports = { assetsSubDirectory: 'static', assetsPublicPath: '/', + /** + * SourceMap + */ productionSourceMap: true, + // 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` // Set to `true` or `false` to always turn it on or off - bundleAnalyzerReport: process.env.npm_config_report } } From 1cbcde197445f91897d90567b405c0bf1e1e7d5b Mon Sep 17 00:00:00 2001 From: =?UTF-8?q?Thorsten=20L=C3=BCnborg?= Date: Sat, 11 Nov 2017 14:12:27 +0100 Subject: [PATCH 24/38] Add sourcemap option to postCSS-loader options (#1039) * Add sourcemap option to postCSS-loader options * Update utils.js * fix condition, should als fail on `undefined` --- template/build/utils.js | 7 +++++-- 1 file changed, 5 insertions(+), 2 deletions(-) diff --git a/template/build/utils.js b/template/build/utils.js index a66d1d4ca7..dfed56f424 100644 --- a/template/build/utils.js +++ b/template/build/utils.js @@ -23,12 +23,15 @@ exports.cssLoaders = function (options) { } var postcssLoader = { - loader: 'postcss-loader' + loader: 'postcss-loader', + options: { + sourceMap: options.sourceMap + } } // generate loader string to be used with extract text plugin function generateLoaders (loader, loaderOptions) { - const loaders = options.usePostCSS !== false ? [cssLoader, postcssLoader] : [cssLoader] + const loaders = options.usePostCSS ? [cssLoader, postcssLoader] : [cssLoader] if (loader) { loaders.push({ loader: loader + '-loader', From cdb3710377b8fbe5ad3df4d094acc77c174e41e1 Mon Sep 17 00:00:00 2001 From: Edd Yerburgh Date: Sun, 12 Nov 2017 12:38:05 +0000 Subject: [PATCH 25/38] Add Jest as new unit test runner, keep Karma + Mocha as a fallback (#824) * refactor: replace karma and mocha with jest * refactor: remove webpack.test.conf * refactor: prompt jest instead of mocha and karma * feat(jest): add coverage reporting * docs(jest): update unit.md with details of jest * docs(jest): remove karma files from structure.md * docs(jest): replace details on Karma with details on Jest * docs: add missing period * docs(jest): replace karma with Jest in commands.md * docs(jest): update npm run unit bullet points * refactor: use module-resolver in place of jest moduleNameMapper * refactor: remove .vue extension from Hello import * test: include src files in test coverage * test: only ignore router/index in coverage if router option selected * chore: fix merge conflicts * chore: add MIT free Jest * Reference dev script in start script instead of copy pasting (#894) Less duplication FTW. * feat: add karma option * refactor: use const in webpack.test.conf * add version tag to config/index.js * stick to ES5 this file is not transpiled * Bumping Vue+VueRouter versions, some minor fixes. (#986) * switch hello-world tag to PascalCase (#951) * fix Es6 code issue. This file is not transpiled, so we should stick to ES5 * Fix bug in dev-server when a proxyTable entry is a string (#965) `options` can not be a `const` because it is modified if value is a string. * Fix casing * Revert 9befbfc * update to vue and vue-router latest version (#984) - vue 2.5 - vue-router 3.0 * Fix missing dependency bumps (#987) * switch hello-world tag to PascalCase (#951) * fix Es6 code issue. This file is not transpiled, so we should stick to ES5 * Fix bug in dev-server when a proxyTable entry is a string (#965) `options` can not be a `const` because it is modified if value is a string. * Fix casing * Revert 9befbfc * update to vue and vue-router latest version (#984) - vue 2.5 - vue-router 3.0 * fix missing dependency updates for * vue-template compiler * vue-loader * bump version string * refactor: use jest module mapping * feat(jest): filter jest setup file * fix: fix trailing comma * docs: add Jest and Karma to unit section * fix: add Jest options if jest option * test: change env in .eslintrc * fix: remove merge trace * fix: merge package.json with develop * docs: split unit test docs into Jest and Karma * docs: add Karma and Jest to README * docs: reimplement karma files in structure.md --- README.md | 5 +- docs/commands.md | 5 +- docs/structure.md | 7 ++- docs/unit.md | 26 +++++++-- meta.js | 29 +++++++++- template/.babelrc | 3 +- template/config/index.js | 1 + template/package.json | 57 ++++++++++++++++--- template/src/components/HelloWorld.vue | 3 - template/src/router/index.js | 2 +- template/test/unit/.eslintrc | 12 ++-- template/test/unit/setup.js | 3 + .../{Hello.spec.js => HelloWorld.spec.js} | 2 +- test.sh | 0 14 files changed, 121 insertions(+), 34 deletions(-) create mode 100644 template/test/unit/setup.js rename template/test/unit/specs/{Hello.spec.js => HelloWorld.spec.js} (70%) mode change 100644 => 100755 test.sh diff --git a/README.md b/README.md index 751a2ed6a2..a4b24503a5 100644 --- a/README.md +++ b/README.md @@ -39,10 +39,9 @@ The development server will run on port 8080 by default. If that port is already - Static assets compiled with version hashes for efficient long-term caching, and an auto-generated production `index.html` with proper URLs to these generated assets. - Use `npm run build --report`to build with bundle size analytics. -- `npm run unit`: Unit tests run in PhantomJS with [Karma](http://karma-runner.github.io/0.13/index.html) + [Mocha](http://mochajs.org/) + [karma-webpack](https://github.com/webpack/karma-webpack). +- `npm run unit`: Unit tests run in [JSDOM](https://github.com/tmpvar/jsdom) with [Jest](https://facebook.github.io/jest/), or in PhantomJS with Karma + Mocha + karma-webpack. - Supports ES2015+ in test files. - - Supports all webpack loaders. - - Easy mock injection. + - Easy mocking. - `npm run e2e`: End-to-end tests with [Nightwatch](http://nightwatchjs.org/). - Run tests in multiple browsers in parallel. diff --git a/docs/commands.md b/docs/commands.md index 2a067d8ce0..29aa12c76e 100644 --- a/docs/commands.md +++ b/docs/commands.md @@ -23,11 +23,10 @@ All build commands are executed via [NPM Scripts](https://docs.npmjs.com/misc/sc ### `npm run unit` -> Run unit tests in PhantomJS with [Karma](https://karma-runner.github.io/). See [Unit Testing](unit.md) for more details. +> Run unit tests in JSDOM with [Jest](https://facebook.github.io/jest/docs/getting-started.html). See [Unit Testing](unit.md) for more details. - Supports ES2015+ in test files. -- Supports all webpack loaders. -- Easy [mock injection](http://vuejs.github.io/vue-loader/en/workflow/testing-with-mocks.html). +- Easy [mocking](https://facebook.github.io/jest/docs/mock-functions.html). ### `npm run e2e` diff --git a/docs/structure.md b/docs/structure.md index 8daf54301b..05d3a06a1a 100644 --- a/docs/structure.md +++ b/docs/structure.md @@ -17,9 +17,10 @@ ├── static/ # pure static assets (directly copied) ├── test/ │ └── unit/ # unit tests -│ │   ├── specs/ # test spec files -│ │   ├── index.js # test build entry file -│ │   └── karma.conf.js # test runner config file +│ │ ├── specs/ # test spec files +│ │ ├── setup.js # file that runs before Jest tests +│ │ ├── index.js # test build entry file +│ │ └── karma.conf.js # test runner config file │ └── e2e/ # e2e tests │ │   ├── specs/ # test spec files │ │   ├── custom-assertions/ # custom assertions for e2e tests diff --git a/docs/unit.md b/docs/unit.md index faeb527c16..54a8d76cfd 100644 --- a/docs/unit.md +++ b/docs/unit.md @@ -1,7 +1,25 @@ # Unit Testing +This project offers two options for unit testing—Jest, and Karma and Mocha. + An overview of the tools used by this boilerplate for unit testing: +## Jest + +- [Jest](https://facebook.github.io/jest/): the test runner that launches JSDOM runs the tests and reports the results to us. + +### Files + +- `setup.js` + + Jest runs this file before it runs the unit tests. It sets the Vue production tip to false. + +### Mocking Dependencies + +The Jest boilerplate comes with the ability to mock dependencies. See the [mock functions guide](https://facebook.github.io/jest/docs/mock-functions.html) for more details. + +## Karma and Mocha + - [Karma](https://karma-runner.github.io/): the test runner that launches browsers, runs the tests and reports the results to us. - [karma-webpack](https://github.com/webpack/karma-webpack): the plugin for Karma that bundles our tests using Webpack. - [Mocha](https://mochajs.org/): the test framework that we write test specs with. @@ -10,7 +28,7 @@ An overview of the tools used by this boilerplate for unit testing: Chai and Sinon are integrated using [karma-sinon-chai](https://github.com/kmees/karma-sinon-chai), so all Chai interfaces (`should`, `expect`, `assert`) and `sinon` are globally available in test files. -And the files: +### Files - `index.js` @@ -24,10 +42,10 @@ And the files: This is the Karma configuration file. See [Karma docs](https://karma-runner.github.io/) for more details. -## Running Tests in More Browsers +### Running Tests in More Browsers You can run the tests in multiple real browsers by installing more [karma launchers](https://karma-runner.github.io/1.0/config/browsers.html) and adjusting the `browsers` field in `test/unit/karma.conf.js`. -## Mocking Dependencies +### Mocking Dependencies -This boilerplate comes with [inject-loader](https://github.com/plasticine/inject-loader) installed by default. For usage with `*.vue` components, see [vue-loader docs on testing with mocks](http://vue-loader.vuejs.org/en/workflow/testing-with-mocks.html). +The Karma unit test boilerplate comes with [inject-loader](https://github.com/plasticine/inject-loader) installed by default. For usage with `*.vue` components, see [vue-loader docs on testing with mocks](http://vue-loader.vuejs.org/en/workflow/testing-with-mocks.html). diff --git a/meta.js b/meta.js index 45d3acfb03..3ac83da625 100644 --- a/meta.js +++ b/meta.js @@ -72,7 +72,29 @@ module.exports = { }, "unit": { "type": "confirm", - "message": "Setup unit tests with Karma + Mocha?" + "message": "Setup unit tests" + }, + "runner": { + "when": "unit", + "type": "list", + "message": "Pick a test runner", + "choices": [ + { + "name": "Jest", + "value": "jest", + "short": "jest" + }, + { + "name": "Karma and Mocha", + "value": "karma", + "short": "karma" + }, + { + "name": "none (configure it yourself)", + "value": "noTest", + "short": "noTest" + } + ] }, "e2e": { "type": "confirm", @@ -84,7 +106,10 @@ module.exports = { ".eslintignore": "lint", "config/test.env.js": "unit || e2e", "test/unit/**/*": "unit", - "build/webpack.test.conf.js": "unit", + "test/unit/index.js": "runner === 'karma'", + "test/unit/karma.conf.js": "runner === 'karma'", + "test/unit/specs/index.js": "runner === 'karma'", + "test/unit/setup.js": "runner === 'jest'", "test/e2e/**/*": "e2e", "src/router/**/*": "router" }, diff --git a/template/.babelrc b/template/.babelrc index d0f20ff4e7..050e00e28c 100644 --- a/template/.babelrc +++ b/template/.babelrc @@ -8,8 +8,9 @@ "plugins": ["transform-runtime"], "env": { "test": { - "presets": ["env", "stage-2"], + "presets": ["env", "stage-2"]{{#if_eq runner "karma"}}, "plugins": ["istanbul"] + {{/if_eq}} } } } diff --git a/template/config/index.js b/template/config/index.js index a61e95b59d..08d68ec5ab 100644 --- a/template/config/index.js +++ b/template/config/index.js @@ -1,3 +1,4 @@ + 'use strict' // Template version: 1.1.3 // see http://vuejs-templates.github.io/webpack for documentation. diff --git a/template/package.json b/template/package.json index 64e165d3f6..fc75156633 100644 --- a/template/package.json +++ b/template/package.json @@ -7,11 +7,21 @@ "scripts": { "dev": "webpack-dev-server --inline --progress --config build/webpack.dev.conf.js", "start": "npm run dev", - "build": "node build/build.js"{{#unit}}, - "unit": "cross-env BABEL_ENV=test karma start test/unit/karma.conf.js --single-run"{{/unit}}{{#e2e}}, - "e2e": "node test/e2e/runner.js"{{/e2e}}{{#if_or unit e2e}}, - "test": "{{#unit}}npm run unit{{/unit}}{{#unit}}{{#e2e}} && {{/e2e}}{{/unit}}{{#e2e}}npm run e2e{{/e2e}}"{{/if_or}}{{#lint}}, - "lint": "eslint --ext .js,.vue src{{#unit}} test/unit/specs{{/unit}}{{#e2e}} test/e2e/specs{{/e2e}}"{{/lint}} + {{#if_eq runner "jest"}} + "unit": "jest test/unit/specs --coverage", + {{/if_eq}} + {{#if_eq runner "karma"}} + "unit": "cross-env BABEL_ENV=test karma start test/unit/karma.conf.js --single-run", + {{/if_eq}} + {{#e2e}} + "e2e": "node test/e2e/runner.js",{{/e2e}} + {{#if_or unit e2e}} + "test": "{{#unit}}npm run unit{{/unit}}{{#unit}}{{#e2e}} && {{/e2e}}{{/unit}}{{#e2e}}npm run e2e{{/e2e}}", + {{/if_or}} + {{#lint}} + "lint": "eslint --ext .js,.vue src{{#unit}} test/unit/specs{{/unit}}{{#e2e}} test/e2e/specs{{/e2e}}", + {{/lint}} + "build": "node build/build.js" }, "dependencies": { "vue": "^2.5.2"{{#router}}, @@ -50,12 +60,18 @@ {{/if_eq}} {{/lint}} "eventsource-polyfill": "^0.9.6", + "express": "^4.14.1", "extract-text-webpack-plugin": "^3.0.0", "file-loader": "^1.1.4", "friendly-errors-webpack-plugin": "^1.6.1", "html-webpack-plugin": "^2.30.1", "webpack-bundle-analyzer": "^2.9.0", - {{#unit}} + {{#if_eq runner "jest"}} + "babel-jest": "^21.0.2", + "jest": "^21.2.0", + "vue-jest": "^1.0.2", + {{/if_eq}} + {{#if_eq runner "karma"}} "cross-env": "^5.0.1", "karma": "^1.4.1", "karma-coverage": "^1.1.1", @@ -73,7 +89,7 @@ "inject-loader": "^3.0.0", "babel-plugin-istanbul": "^4.1.1", "phantomjs-prebuilt": "^2.1.14", - {{/unit}} + {{/if_eq}} "node-notifier": "^5.1.2", {{#e2e}} "chromedriver": "^2.27.2", @@ -85,7 +101,6 @@ "shelljs": "^0.7.6", "optimize-css-assets-webpack-plugin": "^3.2.0", "ora": "^1.2.0", - "postcss-loader": "^2.0.8", "rimraf": "^2.6.0", "url-loader": "^0.5.8", "vue-loader": "^13.3.0", @@ -96,6 +111,32 @@ "webpack-dev-server": "^2.9.1", "webpack-merge": "^4.1.0" }, + {{#if_eq runner "jest"}} + "jest": { + "moduleFileExtensions": [ + "js", + "json", + "vue" + ], + "moduleNameMapper": { + "^@/(.*)$": "/src/$1" + }, + "transform": { + "^.+\\.js$": "/node_modules/babel-jest", + ".*\\.(vue)$": "/node_modules/vue-jest" + }, + "setupFiles": ["/test/unit/setup"], + "mapCoverage": true, + "collectCoverageFrom" : [ + "src/**/*.{js,vue}", + "!src/main.js", + {{#router}} + "!src/router/index.js", + {{/router}} + "!**/node_modules/**" + ] + }, + {{/if_eq}} "engines": { "node": ">= 4.0.0", "npm": ">= 3.0.0" diff --git a/template/src/components/HelloWorld.vue b/template/src/components/HelloWorld.vue index 29036fa0aa..a87d5ead26 100644 --- a/template/src/components/HelloWorld.vue +++ b/template/src/components/HelloWorld.vue @@ -36,17 +36,14 @@ export default { h1, h2 { font-weight: normal; } - ul { list-style-type: none; padding: 0; } - li { display: inline-block; margin: 0 10px; } - a { color: #42b983; } diff --git a/template/src/router/index.js b/template/src/router/index.js index 9bdda48bd3..89023c58a4 100644 --- a/template/src/router/index.js +++ b/template/src/router/index.js @@ -8,7 +8,7 @@ export default new Router({ routes: [ { path: '/', - name: 'Hello', + name: 'HelloWorld', component: HelloWorld{{#if_eq lintConfig "airbnb"}},{{/if_eq}} }{{#if_eq lintConfig "airbnb"}},{{/if_eq}} ]{{#if_eq lintConfig "airbnb"}},{{/if_eq}} diff --git a/template/test/unit/.eslintrc b/template/test/unit/.eslintrc index 959a4f4b57..99ed4933ac 100644 --- a/template/test/unit/.eslintrc +++ b/template/test/unit/.eslintrc @@ -1,9 +1,11 @@ { - "env": { - "mocha": true - }, + "env": {{{#if_eq runner "karma"}} + "mocha": true{{/if_eq}}{{#if_eq runner "jest"}} + "jest"{{/if_eq}} + }{{#if_eq runner "karma"}}, "globals": { "expect": true, - "sinon": true - } + "sinon": true, + "jest": true + }{{/if_eq}} } diff --git a/template/test/unit/setup.js b/template/test/unit/setup.js new file mode 100644 index 0000000000..edbdbae81e --- /dev/null +++ b/template/test/unit/setup.js @@ -0,0 +1,3 @@ +import Vue from 'vue' + +Vue.config.productionTip = false diff --git a/template/test/unit/specs/Hello.spec.js b/template/test/unit/specs/HelloWorld.spec.js similarity index 70% rename from template/test/unit/specs/Hello.spec.js rename to template/test/unit/specs/HelloWorld.spec.js index af36aff7bc..5e8f143967 100644 --- a/template/test/unit/specs/Hello.spec.js +++ b/template/test/unit/specs/HelloWorld.spec.js @@ -6,6 +6,6 @@ describe('HelloWorld.vue', () => { const Constructor = Vue.extend(HelloWorld){{#if_eq lintConfig "airbnb"}};{{/if_eq}} const vm = new Constructor().$mount(){{#if_eq lintConfig "airbnb"}};{{/if_eq}} expect(vm.$el.querySelector('.hello h1').textContent) - .to.equal('Welcome to Your Vue.js App'){{#if_eq lintConfig "airbnb"}};{{/if_eq}} + {{#if_eq runner "karma"}}.to.equal('Welcome to Your Vue.js App'){{#if_eq lintConfig "airbnb"}};{{/if_eq}}{{/if_eq}}{{#if_eq runner "jest"}}.toEqual('Welcome to Your Vue.js App'){{#if_eq lintConfig "airbnb"}};{{/if_eq}}{{/if_eq}} }){{#if_eq lintConfig "airbnb"}};{{/if_eq}} }){{#if_eq lintConfig "airbnb"}};{{/if_eq}} diff --git a/test.sh b/test.sh old mode 100644 new mode 100755 From dff87a88cbe1fce0a3d652cff63db39ad6edf5da Mon Sep 17 00:00:00 2001 From: Thorsten Date: Sun, 12 Nov 2017 14:01:52 +0100 Subject: [PATCH 26/38] fix handlebars syntax error --- template/test/unit/.eslintrc | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/template/test/unit/.eslintrc b/template/test/unit/.eslintrc index 99ed4933ac..3b01aee033 100644 --- a/template/test/unit/.eslintrc +++ b/template/test/unit/.eslintrc @@ -1,5 +1,5 @@ { - "env": {{{#if_eq runner "karma"}} + "env": { {{#if_eq runner "karma"}} "mocha": true{{/if_eq}}{{#if_eq runner "jest"}} "jest"{{/if_eq}} }{{#if_eq runner "karma"}}, From 9a10ad78dbdb7e4fc70ec6856ff52ebd1db87a23 Mon Sep 17 00:00:00 2001 From: Thorsten Date: Sun, 12 Nov 2017 14:05:16 +0100 Subject: [PATCH 27/38] correct template version numbers --- package.json | 2 +- template/config/index.js | 2 +- 2 files changed, 2 insertions(+), 2 deletions(-) diff --git a/package.json b/package.json index 0d0a591880..a94b509e62 100644 --- a/package.json +++ b/package.json @@ -1,6 +1,6 @@ { "name": "vue-cli-template-webpack", - "version": "2.0.0", + "version": "1.2.0", "license": "MIT", "description": "A full-featured Webpack setup with hot-reload, lint-on-save, unit testing & css extraction.", "scripts": { diff --git a/template/config/index.js b/template/config/index.js index 08d68ec5ab..0cda76ec6c 100644 --- a/template/config/index.js +++ b/template/config/index.js @@ -1,6 +1,6 @@ 'use strict' -// Template version: 1.1.3 +// Template version: 1.2.0 // see http://vuejs-templates.github.io/webpack for documentation. const path = require('path') From f8f3a09e2aded074abac2fb78562ca401c0b4bee Mon Sep 17 00:00:00 2001 From: Thorsten Date: Sun, 12 Nov 2017 14:23:27 +0100 Subject: [PATCH 28/38] fix syntax error in test eslint file --- template/test/unit/.eslintrc | 11 +++++------ 1 file changed, 5 insertions(+), 6 deletions(-) diff --git a/template/test/unit/.eslintrc b/template/test/unit/.eslintrc index 3b01aee033..74061c48b8 100644 --- a/template/test/unit/.eslintrc +++ b/template/test/unit/.eslintrc @@ -1,11 +1,10 @@ { "env": { {{#if_eq runner "karma"}} "mocha": true{{/if_eq}}{{#if_eq runner "jest"}} - "jest"{{/if_eq}} - }{{#if_eq runner "karma"}}, - "globals": { + "jest": true{{/if_eq}} + }, + "globals": { {{#if_eq runner "karma"}} "expect": true, - "sinon": true, - "jest": true - }{{/if_eq}} + "sinon": true{{/if_eq}} + } } From aeb594ad3ea456dc028ad38d113982d398c3d509 Mon Sep 17 00:00:00 2001 From: Thorsten Date: Sun, 12 Nov 2017 14:34:32 +0100 Subject: [PATCH 29/38] readjusting docs for unit testing a bit. --- docs/unit.md | 6 ++++-- 1 file changed, 4 insertions(+), 2 deletions(-) diff --git a/docs/unit.md b/docs/unit.md index 54a8d76cfd..c14c46b4f9 100644 --- a/docs/unit.md +++ b/docs/unit.md @@ -1,8 +1,10 @@ # Unit Testing -This project offers two options for unit testing—Jest, and Karma and Mocha. +This project offers two options for unit testing: + +1. Jest +2. Karma and Mocha. -An overview of the tools used by this boilerplate for unit testing: ## Jest From be2cbed3f11698c086d76779e11e8251fba6dc36 Mon Sep 17 00:00:00 2001 From: Thorsten Date: Sun, 12 Nov 2017 14:41:29 +0100 Subject: [PATCH 30/38] fix meta.js when no unit AND e2e test option was selected --- meta.js | 8 ++++---- 1 file changed, 4 insertions(+), 4 deletions(-) diff --git a/meta.js b/meta.js index 3ac83da625..6f7b0f80d8 100644 --- a/meta.js +++ b/meta.js @@ -106,10 +106,10 @@ module.exports = { ".eslintignore": "lint", "config/test.env.js": "unit || e2e", "test/unit/**/*": "unit", - "test/unit/index.js": "runner === 'karma'", - "test/unit/karma.conf.js": "runner === 'karma'", - "test/unit/specs/index.js": "runner === 'karma'", - "test/unit/setup.js": "runner === 'jest'", + "test/unit/index.js": "unit && runner === 'karma'", + "test/unit/karma.conf.js": "unit && runner === 'karma'", + "test/unit/specs/index.js": "unit && runner === 'karma'", + "test/unit/setup.js": "unit && runner === 'jest'", "test/e2e/**/*": "e2e", "src/router/**/*": "router" }, From 19b89ebc3297f171014568ae5f32d870d5c4259f Mon Sep 17 00:00:00 2001 From: Thorsten Date: Thu, 12 Oct 2017 01:40:32 +0200 Subject: [PATCH 31/38] Barman! --- template/build/webpack.prod.conf.js | 9 +++++++++ 1 file changed, 9 insertions(+) diff --git a/template/build/webpack.prod.conf.js b/template/build/webpack.prod.conf.js index 19cfe25ced..8a6aa88ae6 100644 --- a/template/build/webpack.prod.conf.js +++ b/template/build/webpack.prod.conf.js @@ -95,6 +95,15 @@ const webpackConfig = merge(baseWebpackConfig, { name: 'manifest', chunks: ['vendor'] }), + // 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: true, + children: true, + minChnks: 3, + }), // copy custom static assets new CopyWebpackPlugin([ { From 39f5853a980bffab5549c914f7a1e62fad6ec770 Mon Sep 17 00:00:00 2001 From: Thorsten Date: Sun, 12 Nov 2017 15:12:26 +0100 Subject: [PATCH 32/38] add async vendor chunk (+2 squashed commits) Squashed commits: [00b5ae6] small fixes [b125493] improve async vendor chunk settings. small fixes --- template/build/webpack.prod.conf.js | 5 +++-- 1 file changed, 3 insertions(+), 2 deletions(-) diff --git a/template/build/webpack.prod.conf.js b/template/build/webpack.prod.conf.js index 8a6aa88ae6..f1cdf99b80 100644 --- a/template/build/webpack.prod.conf.js +++ b/template/build/webpack.prod.conf.js @@ -100,10 +100,11 @@ const webpackConfig = merge(baseWebpackConfig, { // see: https://webpack.js.org/plugins/commons-chunk-plugin/#extra-async-commons-chunk new webpack.optimize.CommonsChunkPlugin({ name: 'app', - async: true, + async: 'vendor-async', children: true, - minChnks: 3, + minChunks: 3, }), + // copy custom static assets new CopyWebpackPlugin([ { From 0a9c63d9ed516f2fc09b1ce90743c49e0e248cf0 Mon Sep 17 00:00:00 2001 From: Thomas Schersach Date: Sun, 12 Nov 2017 15:21:45 +0100 Subject: [PATCH 33/38] Add historyApiFallback in dev-server config (#1044) --- template/build/webpack.dev.conf.js | 1 + 1 file changed, 1 insertion(+) diff --git a/template/build/webpack.dev.conf.js b/template/build/webpack.dev.conf.js index e47767d6fd..cdab3636ef 100644 --- a/template/build/webpack.dev.conf.js +++ b/template/build/webpack.dev.conf.js @@ -17,6 +17,7 @@ const devWebpackConfig = merge(baseWebpackConfig, { // these devServer options should be customized in /config/index.js devServer: { + historyApiFallback: true, hot: true, host: process.env.HOST || config.dev.host, port: process.env.PORT || config.dev.port, From d4181af50684f863f94b287d4b02b2433231af1d Mon Sep 17 00:00:00 2001 From: Thorsten Date: Sun, 12 Nov 2017 15:30:55 +0100 Subject: [PATCH 34/38] add context path to base config --- template/build/webpack.base.conf.js | 1 + 1 file changed, 1 insertion(+) diff --git a/template/build/webpack.base.conf.js b/template/build/webpack.base.conf.js index 89931abb7c..e2f09ecc61 100644 --- a/template/build/webpack.base.conf.js +++ b/template/build/webpack.base.conf.js @@ -9,6 +9,7 @@ function resolve (dir) { } module.exports = { + context: path.resolve(__dirname, '../'), entry: { app: './src/main.js' }, From 888a627a4e3b61b00c1bf4f0756c6b0f6524a3e9 Mon Sep 17 00:00:00 2001 From: Ryan Liu Date: Sun, 12 Nov 2017 22:52:47 +0800 Subject: [PATCH 35/38] Use webpack 3's standard way to generate a manifest in CommonsChunkPlugin (#1028) The doc URL: https://webpack.js.org/plugins/commons-chunk-plugin/#manifest-file * `minChunks` is set to `Infinity` so that only webpack runtime is written to manifest file. * `chunnks: ['vendor']` is removed as entry chunks are selected if `chunks` is omitted. --- template/build/webpack.prod.conf.js | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/template/build/webpack.prod.conf.js b/template/build/webpack.prod.conf.js index f1cdf99b80..aaff3f9e63 100644 --- a/template/build/webpack.prod.conf.js +++ b/template/build/webpack.prod.conf.js @@ -93,7 +93,7 @@ const webpackConfig = merge(baseWebpackConfig, { // prevent vendor hash from being updated whenever app bundle is updated new webpack.optimize.CommonsChunkPlugin({ name: 'manifest', - chunks: ['vendor'] + minChunks: Infinity, }), // This instance extracts shared chunks from code splitted chunks and bundles them // in a separate chunk, similar to the vendor chunk From ac0ea0278bd9bc2dc1a13ff6284009b8252e323b Mon Sep 17 00:00:00 2001 From: Dave Woodall Date: Sun, 12 Nov 2017 09:53:30 -0500 Subject: [PATCH 36/38] Grammar and typo fixes on docs (#992) --- docs/pre-processors.md | 2 +- docs/static.md | 4 ++-- 2 files changed, 3 insertions(+), 3 deletions(-) diff --git a/docs/pre-processors.md b/docs/pre-processors.md index 9d377dfe09..8611ef542f 100644 --- a/docs/pre-processors.md +++ b/docs/pre-processors.md @@ -1,6 +1,6 @@ # Pre-Processors -This boilerplate has pre-configured CSS extraction for most popular CSS pre-processors including LESS, SASS, Stylus, and PostCSS. To use a pre-processor, all you need to do is installing the appropriate webpack loader for it. For example, to use SASS: +This boilerplate has pre-configured CSS extraction for most popular CSS pre-processors including LESS, SASS, Stylus, and PostCSS. To use a pre-processor, all you need to do is install the appropriate webpack loader for it. For example, to use SASS: ``` bash npm install sass-loader node-sass --save-dev diff --git a/docs/static.md b/docs/static.md index ab3c1fc4da..9987ec824e 100644 --- a/docs/static.md +++ b/docs/static.md @@ -6,9 +6,9 @@ You will notice in the project structure we have two directories for static asse To answer this question, we first need to understand how Webpack deals with static assets. In `*.vue` components, all your templates and CSS are parsed by `vue-html-loader` and `css-loader` to look for asset URLs. For example, in `` and `background: url(./logo.png)`, `"./logo.png"` is a relative asset path and will be **resolved by Webpack as a module dependency**. -Because `logo.png` is not JavaScript, when treated as a module dependency, we need to use `url-loader` and `file-loader` to process it. This boilerplate has already configured these loaders for you, so you basically get features such as filename fingerprinting and conditional base64 inlining for free, while being able to use relative/module paths without worrying about deployment. +Because `logo.png` is not JavaScript, when treated as a module dependency, we need to use `url-loader` and `file-loader` to process it. This template has already configured these loaders for you, so you get features such as filename fingerprinting and conditional base64 inlining for free, while being able to use relative/module paths without worrying about deployment. -Since these assets may be inlined/copied/renamed during build, they are essentially part of your source code. This is why it is recommended to place Webpack-processed static assets inside `/src`, along side other source files. In fact, you don't even have to put them all in `/src/assets`: you can organize them based on the module/component using them. For example, you can put each component in its own directory, with its static assets right next to it. +Since these assets may be inlined/copied/renamed during build, they are essentially part of your source code. This is why it is recommended to place Webpack-processed static assets inside `/src`, alongside other source files. In fact, you don't even have to put them all in `/src/assets`: you can organize them based on the module/component using them. For example, you can put each component in its own directory, with its static assets right next to it. ### Asset Resolving Rules From db75f1fadb47507c36cb7e39cf1fc202a0eeae68 Mon Sep 17 00:00:00 2001 From: =?UTF-8?q?=E3=81=8B=E3=81=8C=E3=81=BF?= Date: Sun, 12 Nov 2017 22:59:11 +0800 Subject: [PATCH 37/38] pass cssSourceMap option to vue-loader (#756) --- template/build/vue-loader.conf.js | 9 ++++++--- 1 file changed, 6 insertions(+), 3 deletions(-) diff --git a/template/build/vue-loader.conf.js b/template/build/vue-loader.conf.js index eece58fe1b..d2ece8f322 100644 --- a/template/build/vue-loader.conf.js +++ b/template/build/vue-loader.conf.js @@ -2,14 +2,17 @@ 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: isProduction - ? config.build.productionSourceMap - : config.dev.cssSourceMap, + sourceMap: sourceMapEnabled, extract: isProduction }), + cssSourceMap: sourceMapEnabled, transformToRequire: { video: 'src', source: 'src', From 626bc9806a53d0bd33b5436af1df56155f5f26a6 Mon Sep 17 00:00:00 2001 From: Ryan Liu Date: Mon, 13 Nov 2017 01:50:04 +0800 Subject: [PATCH 38/38] Set ExtractTextPlugin.allChunks to true (#1027) * When using CommonsChunkPlugin and there are extracted chunks (from ExtractTextPlugin.extract) in the commons chunk, allChunks must be set to true https://github.com/webpack-contrib/extract-text-webpack-plugin * Explicitly set allChunks to false along with some useful info on codesplit chunks (credit to @LinusBorg) * Update webpack.prod.conf.js --- template/build/webpack.prod.conf.js | 6 +++++- 1 file changed, 5 insertions(+), 1 deletion(-) diff --git a/template/build/webpack.prod.conf.js b/template/build/webpack.prod.conf.js index aaff3f9e63..0d281189e6 100644 --- a/template/build/webpack.prod.conf.js +++ b/template/build/webpack.prod.conf.js @@ -43,7 +43,11 @@ const webpackConfig = merge(baseWebpackConfig, { }), // extract css into its own file new ExtractTextPlugin({ - filename: utils.assetsPath('css/[name].[contenthash].css') + filename: utils.assetsPath('css/[name].[contenthash].css'), + // set the following option to `true` if you want to extract CSS from + // codesplit chunks into this main css file as well. + // This will result in *all* of your app's CSS being loaded upfront. + allChunks: false, }), // Compress extracted CSS. We are using this plugin so that possible // duplicated CSS from different components can be deduped.