如何写一个前端脚手架

背景

之前写项目的时候写过需要抽离我的公用代码，发布到公司内部的npm仓库里。
然后我就发现初始化一个最最基础的工程项目也挺麻烦的。从空白目录，要 package.json ，还要代码规范校验工具 eslint.js ， 还要 .gitignore ，还要 babel， 杂七杂八引入了之后，还要选择一下打包工具
每次都要自己配置。
麻烦！

所以准备来写一个脚手架省省力。感觉还是挺有挑战性的，因为从来没有接触过写工具。一直以来都觉得写工具的人真的好牛逼。

定义

cli -> Command Line Interface，一种通过命令行来交互的工具。典型用的比较多的比如我就是 vue-cli。
这里扯一下另一个概念 npm scripts。这个也可以实现开发工作流，通过在 package.json的scripts对象上配置相关的npm命令。
不过这个是针对项目的，cli是全局安装的。

命令行辅助工具

1. commander.js - 帮助解析参数
2. chalk.js - 命令行输出自定义颜色，人机交互会好看点
3. inquirer.js - 常见的交互式命令行，例如，问你选择创建什么类型的项目，如何用户移动上下箭头选择

步骤

创建一个新项目

mkdir angela-cli
cd angela-cli
npm init

创建一个可执行文件

在 angela-cli 中新建一个 bin 文件夹，如何新建一个文件 angela.js 。在 angela.js 头部加上 #! /usr/bin/env node，表示这是一个可执行文件。
然后在 package.json 里的 bin 字段，

"bin": {
    "angela": "bin/angela"
}

当用户全局安装这个 angela-cli 之后，直接在命令行执行 angela，就可以执行这个 angela.js 文件了。

我们在写命令行工具的时候，需要指定一个可执行文件。在package.json中，bin字段用来映射命令名和可执行文件。在通过npm install -g全局安装的时候，npm会symlink可执行文件到prefix/bin文件夹。
如果通过npm install本地安装的时候, npm会symlink可执行文件到./node_modules/.bin/文件夹。

mem-fs-editor.js

因为我这个脚手架涉及到模板，然后如果直接用字符串拼接返回，这么多文件，会有点复杂和乱。所以搞了个这个，可以简单的使用ejs语法。

总结

剩下的就都是按照思路写代码了
(全部代码地址)[https://github.com/AshaLiu/angela-cli]