从零开始构建一个本身的简易命令行工具~

前言：在平常工做中，无论咱们使用哪一种技术选型，安装官方CLI工具项目以后都须要从新配置一番基础配置（好比：less/scss常量及默认引入、ajax封装、经常使用lib函数、UI框架引入等），耗时且无心义，因此咱们能够根据本身的需求，构建本身的命令行工具，方便快速建立一个本身风格新项目！

项目结构

前言：在平常工做中，无论咱们使用哪一种技术选型，安装官方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()

}

})

})

}

复制代码

3.发布到npm

• 登陆npm

npm login

复制代码

• 发布插件（每次从新发布插件须要更新package.json的版本号，调试阶段最好使用npm link开发）

npm publish

复制代码

结语：经过拉取本身所须要的分支代码，快速完成基础项目搭建~。

源码地址：github.com/xxj95719/j8…