feat!: rename --spa option to --router

Author: haoqunjiang

index.js

@@ -45,14 +45,16 @@ function emptyDir(dir) {
 async function init() {
   const cwd = process.cwd()
   // possible options:
-  // --jsx
-  // --spa (todo: split into vuex & vue-router)
   // --typescript / --ts
+  // --jsx
+  // --router / --vue-router
+  // --vuex (todo)
   // --with-tests / --tests / --cypress
   const argv = minimist(process.argv.slice(2), {
     alias: {
       'typescript': ['ts'],
-      'with-tests': ['tests', 'cypress']
+      'with-tests': ['tests', 'cypress'],
+      'router': ['vue-router']
     },
     // all arguments are treated as booleans
     boolean: true
@@ -69,7 +71,9 @@ async function init() {
     //   - whether to overwrite the existing directory or not?
     //   - enter a valid package name for package.json
     // - Project language: JavaScript / TypeScript
-    // - Install Vue Router & Vuex for SPA development?
+    // - Add JSX Support?
+    // - Install Vue Router for SPA development?
+    // - Install Vuex for state management? (TODO)
     // - Add Cypress for testing?
     result = await prompts(
       [
@@ -111,26 +115,26 @@ async function init() {
             isValidPackageName(dir) || 'Invalid package.json name'
         },
         {
-          name: 'needsJSX',
-          type: () => (argv.jsx ? null : 'toggle'),
-          message: 'Add JSX Support?',
+          name: 'needsTypeScript',
+          type: () => (argv.typescript ? null : 'toggle'),
+          message: 'Add TypeScript?',
           initial: false,
           active: 'Yes',
           inactive: 'No'
         },
         {
-          name: 'needsTypeScript',
-          type: () => (argv.typescript ? null : 'toggle'),
-          message: 'Add TypeScript?',
+          name: 'needsJSX',
+          type: () => (argv.jsx ? null : 'toggle'),
+          message: 'Add JSX Support?',
           initial: false,
           active: 'Yes',
           inactive: 'No'
         },
         {
-          name: 'isSPA',
-          type: () => (argv.spa ? null : 'toggle'),
+          name: 'needsRouter',
+          type: () => (argv.router ? null : 'toggle'),
           message:
-            'Add Vue Router & Vuex for Single Page Application development?',
+            'Add Vue Router for Single Page Application development?',
           initial: false,
           active: 'Yes',
           inactive: 'No'
@@ -162,7 +166,7 @@ async function init() {
     shouldOverwrite,
     needsJSX = argv.jsx,
     needsTypeScript = argv.typescript,
-    isSPA = argv.spa,
+    needsRouter = argv.router,
     needsTests = argv.tests
   } = result
   const root = path.join(cwd, targetDir)
@@ -220,7 +224,7 @@ async function init() {
   // prettier-ignore
   const codeTemplate =
     (needsTypeScript ? 'typescript-' : '') +
-    (isSPA ? 'spa' : 'default')
+    (needsRouter ? 'router' : 'default')
   render(`code/${codeTemplate}`)
 
   // TODO:

template/code/spa/cypress/integration/example.spec.js renamed to template/code/router/cypress/integration/example.spec.js

@@ -0,0 +1,5 @@
+{
+  "dependencies": {
+    "vue-router": "^4.0.10"
+  }
+}

template/code/router/package.json

@@ -1,12 +1,9 @@
 import { createApp } from 'vue'
 import App from './App.vue'
-
 import router from './router'
-import store from './store'
 
 const app = createApp(App)
 
 app.use(router)
-app.use(store)
 
 app.mount('#app')