refactor: migrate the codebase to typescript

Author: haoqunjiang

index.js index.tsindex.js renamed to index.ts

@@ -1,19 +1,18 @@
 #!/usr/bin/env node
-// @ts-check
 
-import fs from 'fs'
-import path from 'path'
+import * as fs from 'fs'
+import * as path from 'path'
 
 import minimist from 'minimist'
 import prompts from 'prompts'
 import { red, green, bold } from 'kolorist'
 
-import renderTemplate from './utils/renderTemplate.js'
-import { postOrderDirectoryTraverse, preOrderDirectoryTraverse } from './utils/directoryTraverse.js'
-import generateReadme from './utils/generateReadme.js'
-import getCommand from './utils/getCommand.js'
-import renderEslint from './utils/renderEslint.js'
-import banner from './utils/banner.js'
+import renderTemplate from './utils/renderTemplate'
+import { postOrderDirectoryTraverse, preOrderDirectoryTraverse } from './utils/directoryTraverse'
+import generateReadme from './utils/generateReadme'
+import getCommand from './utils/getCommand'
+import renderEslint from './utils/renderEslint'
+import banner from './utils/banner'
 
 function isValidPackageName(projectName) {
   return /^(?:@[a-z0-9-*~][a-z0-9-*._~]*\/)?[a-z0-9-~][a-z0-9-._~]*$/.test(projectName)
@@ -89,7 +88,19 @@ async function init() {
 
   const forceOverwrite = argv.force
 
-  let result = {}
+  let result: {
+    projectName?: string
+    shouldOverwrite?: boolean
+    packageName?: string
+    needsTypeScript?: boolean
+    needsJsx?: boolean
+    needsRouter?: boolean
+    needsPinia?: boolean
+    needsVitest?: boolean
+    needsCypress?: boolean
+    needsEslint?: boolean
+    needsPrettier?: boolean
+  } = {}
 
   try {
     // Prompts:
@@ -124,7 +135,7 @@ async function init() {
         },
         {
           name: 'overwriteChecker',
-          type: (prev, values = {}) => {
+          type: (prev, values) => {
             if (values.shouldOverwrite === false) {
               throw new Error(red('✖') + ' Operation cancelled')
             }
@@ -199,7 +210,7 @@ async function init() {
         },
         {
           name: 'needsPrettier',
-          type: (prev, values = {}) => {
+          type: (prev, values) => {
             if (isFeatureFlagsUsed || !values.needsEslint) {
               return null
             }

package.json

@@ -34,6 +34,9 @@
   },
   "homepage": "https://github.com/vuejs/create-vue#readme",
   "devDependencies": {
+    "@types/eslint": "^8.4.1",
+    "@types/prompts": "^2.0.14",
+    "@vue/tsconfig": "^0.1.3",
     "esbuild": "^0.14.23",
     "esbuild-plugin-license": "^1.2.2",
     "husky": "^7.0.4",

pnpm-lock.yaml

@@ -26,7 +26,7 @@ SOFTWARE.
 
 await esbuild.build({
   bundle: true,
-  entryPoints: ['index.js'],
+  entryPoints: ['index.ts'],
   outfile: 'outfile.cjs',
   format: 'cjs',
   platform: 'node',

scripts/build.mjs

@@ -0,0 +1,7 @@
+{
+  "extends": "@vue/tsconfig/tsconfig.node.json",
+  "include": ["index.ts", "utils/**/*"],
+  "compilerOptions": {
+    "strict": false
+  }
+}

tsconfig.json

@@ -1,5 +1,5 @@
-import fs from 'fs'
-import path from 'path'
+import * as fs from 'fs'
+import * as path from 'path'
 
 export function preOrderDirectoryTraverse(dir, dirCallback, fileCallback) {
   for (const filename of fs.readdirSync(dir)) {

utils/banner.js utils/banner.tsutils/banner.js renamed to utils/banner.ts

@@ -1,6 +1,4 @@
-import fs from 'fs'
-
-import getCommand from './getCommand.js'
+import getCommand from './getCommand'
 
 const sfcTypeSupportDoc = [
   '',