从零开始构建一个自己的简易命令行工具~-CSDN博客

前言：在日常工作中，不管我们使用哪种技术选型，安装官方CLI工具项目之后都需要重新配置一番基础配置（比如：less/scss常量及默认引入、ajax封装、常用lib函数、UI框架引入等），耗时且无意义，所以我们可以根据自己的需求，构建自己的命令行工具，方便快速创建一个自己风格新项目！

项目结构

编写命令入口

1.创建package.json文件，添加一个配置项bin


npm init

复制代码


"bin": {

    j8: "./bin/j8.js"

}

复制代码

2.安装`commander`、`chalk`、`inquirer`、`download-git-repo`和`ora`插件

commander插件：可以解析用户输入的命令
chalk插件：改变输出文字的颜色
inquirer插件：可以检出用户的输入
download-git-repo插件：可以拉取git仓库的源代码
ora插件：小图标（loading、warn、succeed）美化输出内容


yarn add commander chalk inquirer download-git-repo ora

复制代码

3.编写代码


#!/usr/bin/env node

const fs = require('fs')

const program = require('commander')

const download = require('download-git-repo') 

const chalk = require('chalk') 

const inquirer = require('inquirer')

const ora = require('ora') 

const package = require('../package')

program

.version(package.version)

.option('-i, init', '初始化j8项目')

.parse(process.argv)



program.parse(process.argv)



const question = [

{

type: 'list',

message: `请选择项目类型? `,

name: 'type',

choices: ['MPA(多页应用)', 'Vue', 'React']

},

{

type: 'input',

message: `项目名称: `,

name: 'name',

default: 'my-project'

},

{

type: 'input',

message: `项目描述: `,

name: 'description',

default: 'Description'

},

{

type: 'input',

message: `初始版本: `,

name: 'version',

default: '0.0.1'

},

{

type: 'input',

message: `server端口: `,

name: 'port',

default: '8080'

},

{

type: 'confirm',

message: `使用pug(jade)模版引擎? `,

name: 'template',

when: answers => answers.type === 'MPA(多页应用)',

default: true

}

]



if (program.init) {

console.info('')

inquirer.prompt(question).then(function(answers) {

let downloadUrl

if (answers.type === 'MPA(多页应用)') {

// MPA

downloadUrl = answers.template

? 'xxj95719/multi-page-app'

: 'xxj95719/multi-page-app#html'

} else if (answers.type === 'Vue') {

// Vue

downloadUrl = 'xxj95719/vue-spa'

} else if (answers.type === 'React') {

// React

downloadUrl = 'xxj95719/react-spa'

}

const spinner = ora('正在从github下载...').start()

download(downloadUrl, answers.name, function(err) {

if (!err) {

spinner.clear()

console.info('')

console.info(

chalk.green('-----------------------------------------------------')

)

console.info('')

spinner.succeed(['项目创建成功,请继续进行以下操作:'])

console.info('')

console.info(chalk.cyan(` -  cd ${answers.name}`))

console.info(chalk.cyan(` -  npm install / yarn`))

console.info(chalk.cyan(` -  npm run dev / yarn dev`))

console.info('')

console.info(chalk.gray(`devServer: http://localhost:${answers.port}`))

console.info('')

console.info(

chalk.gray('参考文档: https://github.com/xxj95719/j8-cli/')

)

console.info('')

console.info(

chalk.green('-----------------------------------------------------')

)

console.info('')



fs.readFile(

`${process.cwd()}/${answers.name}/package.json`,

(err, data) => {

if (err) throw err

let _data = JSON.parse(data.toString())

_data.name = answers.name

_data.description = answers.description

_data.version = answers.version

_data.port = answers.port

let str = JSON.stringify(_data, null, 4)

fs.writeFile(

`${process.cwd()}/${answers.name}/package.json`,

str,

function(err) {

if (err) throw err

process.exit()

}

)

}

)

} else {

spinner.warn([

'发生错误，请在https://github.com/xxj95719/j8-cli/issues，Issues留言'

])

process.exit()

}

})

})

}

复制代码