From 9038d4f7bd020ad2623be4f4fe684f518ac91342 Mon Sep 17 00:00:00 2001 From: Vitor Vicente Date: Thu, 7 Nov 2019 12:24:12 -0300 Subject: [PATCH 1/7] add file structure --- template/package.json | 8 ++++++-- template/src/event-bus.js | 2 ++ template/src/{router/index.js => router.js} | 0 3 files changed, 8 insertions(+), 2 deletions(-) create mode 100644 template/src/event-bus.js rename template/src/{router/index.js => router.js} (100%) diff --git a/template/package.json b/template/package.json index 207322b98c..a8fa9a634b 100644 --- a/template/package.json +++ b/template/package.json @@ -26,7 +26,9 @@ }, "dependencies": { "vue": "^2.5.2"{{#router}}, - "vue-router": "^3.0.1"{{/router}} + "vue-router": "^3.0.1"{{/router}}, + "vuex": "^2.1.1", + "axios": "^0.19.0", }, "devDependencies": { {{#lint}} @@ -116,7 +118,9 @@ "portfinder": "^1.0.13", "webpack": "^3.6.0", "webpack-dev-server": "^2.9.1", - "webpack-merge": "^4.1.0" + "webpack-merge": "^4.1.0", + "node-sass": "^4.9.0", + "sass-loader": "^7.1.0", }, "engines": { "node": ">= 6.0.0", diff --git a/template/src/event-bus.js b/template/src/event-bus.js new file mode 100644 index 0000000000..4e5a22cf5c --- /dev/null +++ b/template/src/event-bus.js @@ -0,0 +1,2 @@ +import Vue from 'vue'; +export const Bus = new Vue(); diff --git a/template/src/router/index.js b/template/src/router.js similarity index 100% rename from template/src/router/index.js rename to template/src/router.js From 4f1ea2c6bb1744a530fe1b419a51485a8dfab1b9 Mon Sep 17 00:00:00 2001 From: Vitor Vicente Date: Thu, 7 Nov 2019 13:39:55 -0300 Subject: [PATCH 2/7] add file structure --- template/src/containers/Container.vue | 13 +++++++++++++ template/src/helpers/helper.js | 0 template/src/store/index.js | 0 template/src/views/View.vue | 13 +++++++++++++ 4 files changed, 26 insertions(+) create mode 100644 template/src/containers/Container.vue create mode 100644 template/src/helpers/helper.js create mode 100644 template/src/store/index.js create mode 100644 template/src/views/View.vue diff --git a/template/src/containers/Container.vue b/template/src/containers/Container.vue new file mode 100644 index 0000000000..80ca0fc3cd --- /dev/null +++ b/template/src/containers/Container.vue @@ -0,0 +1,13 @@ + + + diff --git a/template/src/helpers/helper.js b/template/src/helpers/helper.js new file mode 100644 index 0000000000..e69de29bb2 diff --git a/template/src/store/index.js b/template/src/store/index.js new file mode 100644 index 0000000000..e69de29bb2 diff --git a/template/src/views/View.vue b/template/src/views/View.vue new file mode 100644 index 0000000000..80ca0fc3cd --- /dev/null +++ b/template/src/views/View.vue @@ -0,0 +1,13 @@ + + + From 8b915121d8e2fb24be43ab78dac17996313c5181 Mon Sep 17 00:00:00 2001 From: Vitor Vicente Date: Thu, 7 Nov 2019 14:04:57 -0300 Subject: [PATCH 3/7] remove router file --- template/src/router.js | 15 --------------- 1 file changed, 15 deletions(-) delete mode 100644 template/src/router.js diff --git a/template/src/router.js b/template/src/router.js deleted file mode 100644 index 5fa7f9d319..0000000000 --- a/template/src/router.js +++ /dev/null @@ -1,15 +0,0 @@ -import Vue from 'vue' -import Router from 'vue-router' -import HelloWorld from '@/components/HelloWorld' - -Vue.use(Router) - -export default new Router({ - routes: [ - { - path: '/', - name: 'HelloWorld', - component: HelloWorld - } - ] -}) From 63741912e62ad2d352a9911e0d514d2a0b7f7373 Mon Sep 17 00:00:00 2001 From: Vitor Vicente Date: Thu, 7 Nov 2019 14:10:57 -0300 Subject: [PATCH 4/7] alter meta file --- meta.js | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/meta.js b/meta.js index a521f9bdd0..54d65e181a 100644 --- a/meta.js +++ b/meta.js @@ -44,7 +44,7 @@ module.exports = { type: 'string', required: false, message: 'Project description', - default: 'A Vue.js project', + default: 'Projeto padrão Huddle', }, author: { when: 'isNotTest', From 3da1c2bb14e063c1f8cd032eca6502770ccf62da Mon Sep 17 00:00:00 2001 From: Vitor Vicente Date: Thu, 7 Nov 2019 14:14:49 -0300 Subject: [PATCH 5/7] change utils file --- utils/index.js | 4 +--- 1 file changed, 1 insertion(+), 3 deletions(-) diff --git a/utils/index.js b/utils/index.js index fa8d8046f0..5549572a92 100644 --- a/utils/index.js +++ b/utils/index.js @@ -69,9 +69,7 @@ exports.printMessage = function printMessage(data, { green, yellow }) { const message = ` # ${green('Project initialization finished!')} # ======================== - To get started: - ${yellow( `${data.inPlace ? '' : `cd ${data.destDirName}\n `}${installMsg( data @@ -143,4 +141,4 @@ function sortObject(object) { sortedObject[item] = object[item] }) return sortedObject -} +} \ No newline at end of file From 83275058bfba6c1a1de150d98d0ba22616a0c846 Mon Sep 17 00:00:00 2001 From: Vitor Vicente Date: Thu, 7 Nov 2019 14:17:32 -0300 Subject: [PATCH 6/7] change utils file --- utils/index.js | 15 ++++++++++++++- 1 file changed, 14 insertions(+), 1 deletion(-) diff --git a/utils/index.js b/utils/index.js index 5549572a92..3e0e7ee290 100644 --- a/utils/index.js +++ b/utils/index.js @@ -14,7 +14,20 @@ exports.sortDependencies = function sortDependencies(data) { data.inPlace ? '' : data.destDirName, 'package.json' ) - const packageJson = JSON.parse(fs.readFileSync(packageJsonFile)) + const packageJson = { + "name": "vue-cli-template-webpack", + "version": "1.3.1", + "license": "MIT", + "description": "A full-featured Webpack setup with hot-reload, lint-on-save, unit testing & css extraction.", + "scripts": { + "docs": "cd docs && gitbook serve", + "docs:deploy": "bash ./deploy-docs.sh" + }, + "devDependencies": { + "vue-cli": "^2.8.1" + } + } + packageJson.devDependencies = sortObject(packageJson.devDependencies) packageJson.dependencies = sortObject(packageJson.dependencies) fs.writeFileSync(packageJsonFile, JSON.stringify(packageJson, null, 2) + '\n') From cb65ed01440047930bd3ddc939c0473e443e3a6b Mon Sep 17 00:00:00 2001 From: Vitor Vicente Date: Thu, 7 Nov 2019 14:31:45 -0300 Subject: [PATCH 7/7] remove initial files --- .circleci/config.yml | 137 --------------------------- deploy-docs.sh | 2 +- scenarios/README.md | 27 ------ scenarios/full-karma-airbnb.json | 14 --- scenarios/full.json | 14 --- scenarios/index.js | 19 ---- scenarios/minimal.json | 14 --- utils/index.js | 157 ------------------------------- 8 files changed, 1 insertion(+), 383 deletions(-) delete mode 100644 .circleci/config.yml delete mode 100644 scenarios/README.md delete mode 100644 scenarios/full-karma-airbnb.json delete mode 100644 scenarios/full.json delete mode 100644 scenarios/index.js delete mode 100644 scenarios/minimal.json delete mode 100644 utils/index.js diff --git a/.circleci/config.yml b/.circleci/config.yml deleted file mode 100644 index c5186160e0..0000000000 --- a/.circleci/config.yml +++ /dev/null @@ -1,137 +0,0 @@ -version: 2 -vm_settings: &vm_settings - docker: - - image: circleci/node:6.12.3-browsers - -jobs: - install_template_deps: - <<: *vm_settings - working_directory: ~/project/webpack-template - steps: - - checkout - - restore_cache: - key: template-cache-{{ checksum "package.json" }} - - run: - name: Install npm dependencies - command: npm install - - save_cache: - key: template-cache-{{ checksum "package.json" }} - paths: - - node_modules - - run: - name: Rollout minimal scenario - command: VUE_TEMPL_TEST=minimal node_modules/.bin/vue init . test-minimal - - run: - name: Rollout full scenario - command: VUE_TEMPL_TEST=full node_modules/.bin/vue init . test-full - - run: - name: Rollout full-karma-airbnb scenario - command: VUE_TEMPL_TEST=full-karma-airbnb node_modules/.bin/vue init . test-full-karma-airbnb - - persist_to_workspace: - root: ~/project/webpack-template - paths: - - node_modules - - test-* - - scenario_minimal: - <<: *vm_settings - environment: - - VUE_TEMPL_TEST: minimal - working_directory: ~/project/webpack-template/test-minimal - steps: - - attach_workspace: - at: '~/project/webpack-template' - - restore_cache: - key: template-cache-minimal-{{ checksum "package.json" }} - - run: - name: Install npm dependencies - command: npm install - - save_cache: - key: template-cache-minimal-{{ checksum "package.json" }} - paths: - - node_modules - - run: - name: Test build - command: npm run build - - scenario_full: - <<: *vm_settings - working_directory: ~/project/webpack-template/test-full - environment: - - VUE_TEMPL_TEST: full - steps: - - attach_workspace: - at: '~/project/webpack-template' - - restore_cache: - key: template-cache-full-{{ checksum "package.json" }} - - run: - name: Install npm dependencies - command: npm install - - save_cache: - key: template-cache-full-{{ checksum "package.json" }} - paths: - - node_modules - - run: - name: Run Lint - command: npm run lint -- --fix - - run: - name: Run Unit tests - command: npm run unit - when: always - - run: - name: Run e2e tests - command: npm run e2e - when: always - - run: - name: Test build - command: npm run build - when: always - - scenario_full-karma-airbnb: - <<: *vm_settings - working_directory: ~/project/webpack-template/test-full-karma-airbnb - environment: - - VUE_TEMPL_TEST: full-karma-airbnb - steps: - - attach_workspace: - at: '~/project/webpack-template' - - restore_cache: - key: template-cache-full-karma-airbnb-{{ checksum "package.json" }} - - run: - name: Install npm dependencies - command: npm install - - save_cache: - key: template-cache-full-karma-airbnb-{{ checksum "package.json" }} - paths: - - node_modules - - run: - name: Run Lint - command: npm run lint -- --fix - - run: - name: Run Unit tests - command: npm run unit - when: always - - run: - name: Run e2e tests - command: npm run e2e - when: always - - run: - name: Test build - command: npm run build - when: always - - -workflows: - version: 2 - build_and_test: - jobs: - - install_template_deps - - scenario_minimal: - requires: - - install_template_deps - - scenario_full: - requires: - - install_template_deps - - scenario_full-karma-airbnb: - requires: - - install_template_deps \ No newline at end of file diff --git a/deploy-docs.sh b/deploy-docs.sh index a9f76366a4..93c68f3846 100644 --- a/deploy-docs.sh +++ b/deploy-docs.sh @@ -5,4 +5,4 @@ cd _book git init git add -A git commit -m 'update book' -git push -f git@github.com:vuejs-templates/webpack.git master:gh-pages +git push -f git@github.com:vuejs-templates/webpack.git master:gh-pages \ No newline at end of file diff --git a/scenarios/README.md b/scenarios/README.md deleted file mode 100644 index 2fcacaf077..0000000000 --- a/scenarios/README.md +++ /dev/null @@ -1,27 +0,0 @@ -## What is this folder? - -This folder contains test scenarios for the automated tests of the template on CircleCI. - -Each `.json`file contains an object that represents a set of answers to the questions that vue-cli asks the user when installing the template. - -With the code from `index.js`, we insert those answers into the metalsmith metadata and skip the inquirer questions, thus allowing us to run different test scenarios in CI without having to actually provide any answers to inquirer or to mock it. - -## The scenarios - -We currently have 3 scenarios set up: - -1. 'minimal': it basically answers "no" to ever choice, so no router, no eslint, no tests -2. 'full': It answers "yes" to every choice. With router, with linting (standard), with full tests (jest & e2e) -3. 'full-airbnb-karma': like 'full', but using airbnb eslint config instead of standard and karma instead of jest for unit tests. - -Other permutations might be worth testing to secure against edge cases, but this gives us a decent level of security over common combinations. - -## How to use it? - -Choosing a scenario is done through setting an ENV variable named `VUE_TEMPL_TEST`. - -You can run a scenario yourself by running this in your terminal: - -```` -VUE_TEMPL_TEST=minimal vue init webpack your-directory -``` diff --git a/scenarios/full-karma-airbnb.json b/scenarios/full-karma-airbnb.json deleted file mode 100644 index 4e70e573b2..0000000000 --- a/scenarios/full-karma-airbnb.json +++ /dev/null @@ -1,14 +0,0 @@ -{ - "noEscape": true, - "name": "test", - "description": "A Vue.js project", - "author": "CircleCI", - "build": "standalone", - "router": false, - "lint": true, - "lintConfig": "airbnb", - "unit": true, - "runner": "karma", - "e2e": true, - "autoInstall": false -} diff --git a/scenarios/full.json b/scenarios/full.json deleted file mode 100644 index f12d01e828..0000000000 --- a/scenarios/full.json +++ /dev/null @@ -1,14 +0,0 @@ -{ - "noEscape": true, - "name": "test", - "description": "A Vue.js project", - "author": "CircleCI", - "build": "runtime", - "router": false, - "lint": true, - "lintConfig": "standard", - "unit": true, - "runner": "jest", - "e2e": true, - "autoInstall": false -} diff --git a/scenarios/index.js b/scenarios/index.js deleted file mode 100644 index 662f16d8a3..0000000000 --- a/scenarios/index.js +++ /dev/null @@ -1,19 +0,0 @@ -const scenarios = [ - 'full', - 'full-karma-airbnb', - 'minimal' -] - -const index = scenarios.indexOf(process.env.VUE_TEMPL_TEST) - -const isTest = exports.isTest = index !== -1 - -const scenario = isTest && require(`./${scenarios[index]}.json`) - -exports.addTestAnswers = (metalsmith, options, helpers) => { - Object.assign( - metalsmith.metadata(), - { isNotTest: !isTest }, - isTest ? scenario : {} - ) -} \ No newline at end of file diff --git a/scenarios/minimal.json b/scenarios/minimal.json deleted file mode 100644 index abf2637541..0000000000 --- a/scenarios/minimal.json +++ /dev/null @@ -1,14 +0,0 @@ -{ - "noEscape": true, - "name": "test-minimal", - "description": "Testing the minimal template setup", - "author": "CircleCI", - "build": "standalone", - "router": false, - "lint": false, - "lintConfig": "standard", - "unit": false, - "runner": "jest", - "e2e": false, - "autoInstall": false -} diff --git a/utils/index.js b/utils/index.js deleted file mode 100644 index 3e0e7ee290..0000000000 --- a/utils/index.js +++ /dev/null @@ -1,157 +0,0 @@ -const path = require('path') -const fs = require('fs') -const spawn = require('child_process').spawn - -const lintStyles = ['standard', 'airbnb'] - -/** - * Sorts dependencies in package.json alphabetically. - * They are unsorted because they were grouped for the handlebars helpers - * @param {object} data Data from questionnaire - */ -exports.sortDependencies = function sortDependencies(data) { - const packageJsonFile = path.join( - data.inPlace ? '' : data.destDirName, - 'package.json' - ) - const packageJson = { - "name": "vue-cli-template-webpack", - "version": "1.3.1", - "license": "MIT", - "description": "A full-featured Webpack setup with hot-reload, lint-on-save, unit testing & css extraction.", - "scripts": { - "docs": "cd docs && gitbook serve", - "docs:deploy": "bash ./deploy-docs.sh" - }, - "devDependencies": { - "vue-cli": "^2.8.1" - } - } - - packageJson.devDependencies = sortObject(packageJson.devDependencies) - packageJson.dependencies = sortObject(packageJson.dependencies) - fs.writeFileSync(packageJsonFile, JSON.stringify(packageJson, null, 2) + '\n') -} - -/** - * Runs `npm install` in the project directory - * @param {string} cwd Path of the created project directory - * @param {object} data Data from questionnaire - */ -exports.installDependencies = function installDependencies( - cwd, - executable = 'npm', - color -) { - console.log(`\n\n# ${color('Installing project dependencies ...')}`) - console.log('# ========================\n') - return runCommand(executable, ['install'], { - cwd, - }) -} - -/** - * Runs `npm run lint -- --fix` in the project directory - * @param {string} cwd Path of the created project directory - * @param {object} data Data from questionnaire - */ -exports.runLintFix = function runLintFix(cwd, data, color) { - if (data.lint && lintStyles.indexOf(data.lintConfig) !== -1) { - console.log( - `\n\n${color( - 'Running eslint --fix to comply with chosen preset rules...' - )}` - ) - console.log('# ========================\n') - const args = - data.autoInstall === 'npm' - ? ['run', 'lint', '--', '--fix'] - : ['run', 'lint', '--fix'] - return runCommand(data.autoInstall, args, { - cwd, - }) - } - return Promise.resolve() -} - -/** - * Prints the final message with instructions of necessary next steps. - * @param {Object} data Data from questionnaire. - */ -exports.printMessage = function printMessage(data, { green, yellow }) { - const message = ` -# ${green('Project initialization finished!')} -# ======================== -To get started: - ${yellow( - `${data.inPlace ? '' : `cd ${data.destDirName}\n `}${installMsg( - data - )}${lintMsg(data)}npm run dev` - )} - -Documentation can be found at https://vuejs-templates.github.io/webpack -` - console.log(message) -} - -/** - * If the user will have to run lint --fix themselves, it returns a string - * containing the instruction for this step. - * @param {Object} data Data from questionnaire. - */ -function lintMsg(data) { - return !data.autoInstall && - data.lint && - lintStyles.indexOf(data.lintConfig) !== -1 - ? 'npm run lint -- --fix (or for yarn: yarn run lint --fix)\n ' - : '' -} - -/** - * If the user will have to run `npm install` or `yarn` themselves, it returns a string - * containing the instruction for this step. - * @param {Object} data Data from the questionnaire - */ -function installMsg(data) { - return !data.autoInstall ? 'npm install (or if using yarn: yarn)\n ' : '' -} - -/** - * Spawns a child process and runs the specified command - * By default, runs in the CWD and inherits stdio - * Options are the same as node's child_process.spawn - * @param {string} cmd - * @param {array} args - * @param {object} options - */ -function runCommand(cmd, args, options) { - return new Promise((resolve, reject) => { - const spwan = spawn( - cmd, - args, - Object.assign( - { - cwd: process.cwd(), - stdio: 'inherit', - shell: true, - }, - options - ) - ) - - spwan.on('exit', () => { - resolve() - }) - }) -} - -function sortObject(object) { - // Based on https://github.com/yarnpkg/yarn/blob/v1.3.2/src/config.js#L79-L85 - const sortedObject = {} - Object.keys(object) - .sort() - .forEach(item => { - sortedObject[item] = object[item] - }) - return sortedObject -} \ No newline at end of file