当前位置：首页 > news >正文

命令行指引的尝试

news 来源：原创 2025/4/26 1:57:15

效果

在这里插入图片描述

步骤

首先初始化一个空的项目，然后安装一些依赖

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)}
}