写一个快速创建 vue 项目的脚手架

最近新建项目挺多，刚好有现成的模板，就写了个适用于公司内部的脚手架工具，基于 vue cli 3.x + 快速生成 vue 项目基础结构。

具体如何使用，可移步 syvue-cli 查看。这里不过多介绍使用方法，主要记录一下遇到的一些点。

¶一、node 模块

¶1、commander

用来接收终端输入的命令

const { program } = require('commander')
const packageJson = require('../package.json')

program.version(packageJson.version, '-V, -v, --version')
// create
program.command('create').arguments('<project-name>').description('create project').action(require('./actions/create'))

// 解析参数这一行要放到定义的命令最后面
program.parse(process.argv)

¶2、chalk

用来输出不同颜色的信息内容到终端，起到不同的提示作用，不同软件可能输出的颜色有色差，主要集中在 blue 和 cyan。

1	console.log(chalk.cyan('hello deployvue'))

¶3、inquirer

在命令行和用户互动

let answer = await inquirer.prompt([
  {
    type: 'list',
    name: 'template',
    message: `${ chalk.bold('Please pick template type: ') }`,
    choices: [`admin (${ chalk.yellow('management template') })`, `mobile (${ chalk.yellow('mobile template') })`]
  }
])

¶4、ora

命令行加载中的动画效果 ora

let cnpmSpinner = ora(`Installing npm plugins. This might take a while` + '...')
cnpmSpinner.start()
shell.exec(`cd ${ process.cwd() }/${ projectName }; cnpm i`, { silent: true })
cnpmSpinner.stop()

¶5、shelljs

用来在本地执行命令、结束程序，将 silent 设为 true 可隐藏在终端的内容输出

for (let command of buildCommands) {
  console.log(`+ ${ command }`)
  if (shell.exec(`${ command }`).code !== 0) {
    shell.echo(`Run: ${ command } Error`)
    shell.exit(1)
    return
  }
  console.log(chalk.cyan(`DONE  ${ command } complete`))
}