效果

步驟

首先初始化一個空的項目，然后安裝一些依賴

npm init -y
npm install inquirer execa chalk ora

至于這些依賴是干嘛的，如下圖所示：

然后再 package.json 中補充一個 bin

然后再根目錄下新建一個 index.js , 其中的內容如下

#!/usr/bin/env node
import inquirer from 'inquirer'
import chalk from 'chalk'
import ora from 'ora'
import { createProject } from './utils/create.js'console.log(chalk.cyanBright('\n? Welcome to create-vueNew CLI'))const { projectName, template } = await inquirer.prompt([{type: 'input',name: 'projectName',message: 'Project name:',default: 'vueNew-app'},{type: 'list',name: 'template',message: 'Select a template:',choices: ['vue', 'vue-ts']}
])await createProject(projectName, template)

createProject 這個工具的內容如下

import { fileURLToPath } from 'url'
import { dirname } from 'path'
import path from 'path' // 確保引入了 path 模塊
import ora from 'ora'
import ncp from 'ncp'const __filename = fileURLToPath(import.meta.url)
const __dirname = dirname(__filename)export async function createProject(name, template) {const spinner = ora(`Copying ${template} template...`).start()const templatePath = path.join(__dirname, `../templates/${template}`)const targetPath = path.resolve(process.cwd(), name)try {// 使用 ncp 來復制模板文件夾ncp.ncp(templatePath, targetPath, (err) => {if (err) {spinner.fail('Failed to copy template')console.error(err)return}spinner.succeed('Project created!')console.log(`\nNext steps:`)console.log(`  cd ${name}`)console.log(`  npm install`)console.log(`  npm run dev`)})} catch (err) {spinner.fail('Failed to copy template')console.error(err)}
}

然后再模擬幾個 vue 的模板 ，待會兒第二步克隆的時候就是復制這里的文件

本地的 CLI 工具鏈接到全局環境

在項目目錄下運行了 npm link
npm link 會把本地的 CLI 工具鏈接到全局環境，這樣你就可以在任何地方通過命令行運行 create-vueNew。

測試

在隨便一個文件夾下執行 create-vueNew 就會開始執行命令了