传统的前端项目初始流程一般是这样：
可以看出，传统的初始化步骤，花费的时间并不少。而且，人工操作的情况下，总有改漏的情况出现。这个缺点有时很致命。
甚至有马大哈，没有更新项目仓库地址，导致提交代码到旧仓库，这就很尴尬了。。。
基于这些情况，编写命令行工具（CLI）的目的就很明确：
用于新项目工程的初始化利用工具进行初始化，可以节省项目初期的准备时间避免出现改漏的情况杜绝未更新项目版本仓库地址的问题
以下是新的流程示意图：
以下是自动化流程图：
从流程图可以得出两个重要的信息：
配置信息模板文件
命令行工具的角色，是负责将两个信息进行融合，提供一个交互平台给用户。
三、工具准备 3.1 配置信息工具配置信息的获得，需要靠和用户进行交互。由于程序员一般是用终端输入命令进行项目操作。所以，这里选择了两个工具进行支撑。
commander
借鉴Ruby commander理念实现的命令行执行补全解决方案
commander可以接收命令行传入的参数
例子：
npg-cli --help ♫ ♫♬♪♫ npm-package-cli ♫ ♫♬♪♫ Usage: npg-cli [options] Options: -V, --version output the version number -h, --help output usage information run testcli and edit the setting.
inquirer
常用交互式命令行用户界面的集合。
inquirer用询问式的语句，与用户进行交互，接收参数
例子：
npg-cli ♫ ♫♬♪♫ npm-package-cli ♫ ♫♬♪♫ Follow the prompts to complete the project configuration. ? project name test ? version 1.0.0 ? description
3.2 模板信息工具前端的JavaScript 模板引擎，比如ejs，jade等。可以根据传入的参数，对模板标签进行替换，最终生成html。
如果把所有项目文件，不管文件后缀名，都看成是ejs模板，则可以在文件内容中使用ejs语法。
再根据配置信息进行替换，最终生成新文件。
其实，业界依据这个想法，已经有成熟的工具产生。
mem-fs
mem-fs是对文件进行读取，存入内存中。
mem-fs-editor
mem-fs-editor是对内存中的文件信息，使用ejs语法进行编译。最后调用commit方法输出最终文件。
3.3 提示信息工具提示信息，除了console.log，还可以使用色彩更丰富的chalk。
这样，可以输出更直观、友好的提示。
文件操作，有业界成熟的shelljs。
利用shelljs，可以在项目中简化以下步骤：
一些项目文件，不需要修改，只用直接copy。可以使用shelljs.copySync同步方式生成。一些文件夹，需要提前构建，可以使用shelljs.mkdir进行创建
四、实现以下按我做的开源项目——npm-package-cli的创作过程进行分拆、讲解。
4.1 初始化新建项目文件夹npm-package-cli，并在该文件夹下运行npm init，生成package.json。
项目结构如下：
npm-package-cli |-- package.json
4.2 生成全局指令这里要生成的全局指令是npg-cli。
4.2.1 新建执行文件新建文件夹bin,并在文件夹下新建名称为cli的shell脚本文件（注意：不能有后缀名）。
clishell脚本文件内容如下：
#!/usr/bin/env node console.log('hello world');
其中，#!/usr/bin/env node是告诉编译器，以node的方式，运行代码。
并在package.json加入以下内容：
"bin": { "npg-cli": "bin/cli" }
此时，项目结构如下：
npm-package-cli |-- bin |-- cli |-- package.json
4.2.2 链接指令到全局链接指令有两种方式：
npm link
npm install -g
两种方式，都需要在npm-package-cli文件夹下运行，才能生效。
作用是把npg-cli指令，指向全局的bin文件下，实现软链。
在任意文件夹下运行命令：
npg-cli # 输出 hello world
到这里，一个基本的指令就算完成了，接下来是指令的工作内容细化。
4.3 初始化操作类CreationCreation的作用是整合所有操作，并提供接口给指令文件cli。
Creation的结构如下:
class Creation{ constructor(){ // code } do(){ // code } // other function }
其中do方法暴露给脚本文件cli调用。
Creation类放在src/index.js中。
此时，项目结构如下：
npm-package-cli |-- bin |-- cli |-- src |-- index.js |-- package.json
4.4 修改cli文件#!/usr/bin/env node const Creator = require('../src/index.js'); const project = new Creator(); project.do();
这样，只要实现好do方法，就可以完成npg-cli指令的运行了。
4.5 实现命令行参数读取实现npg-cli --help，需要借助上文提到的工具commander。
新建src/command.js文件，文件内容如下：