本文共 1891 字，大约阅读时间需要 6 分钟。
什么是CLI
CLI（command-line interface 命令行界面）是指在图形用户界面得到普及之前使用最为广泛的用户界面，它通常不支持鼠标，用户通过键盘输入指令，计算机接收到指令后，予以执行。也有人称之为字符用户界面（CUI）。
- 典型的CLI界面：
GUI（Graphical User Interface 图形用户界面）是指采用图形方式显示的计算机操作用户界面。
- 典型的GUI界面：
Why CLI？
自古软件设计这个武林有两大流派，其中有一个是”CLI“,另外一个是”GUI“。它们一个为了普渡众生，一个为了提高内力，虽然在GUI出现之前，CLI独步武林。但是随着科技的发展，GUI后发致人很快就一统江湖。但是现在谁是天下第一已经不重要了，重点是如何学会用这两种武术提高自己，在合适的情况下用合适的解决方法。下面是我的理解：
作为互联网深度沉迷患者，很多体验是离不开GUI软件的，比如工作邮件，使用foxmail的GUI界面，我可能只需要点几下鼠标敲几下键盘就可以完成一次工作汇报。
但是作为前端资深复制粘贴工程师，也同样离不开CLI工具，在一个项目完成后，我用配置好的自动化软件（比如gulp），我只需要敲一个命令就可以完成上线前的准备。
到这里各位看官应该懂了，
- CLI更节省计算机资源，提高生产效率。因为不需要处理图形界面，所以开发成本低。适合面对各种geek向的码农。
- GUI用户学习成本更低，体验更好，生产效率相对较低。开发成本高。适合面对普通互联网用户。
在这里不得不提一下，之前做的，虽然很厉害，但是启动太慢了加上界面交互浪费了太多精力没有抓住用户的“刚”，所以从效果来说并不是特别好：（
到这里，如果你依旧对前端如何构建一个CLI感兴趣，请跟我一起，10分钟打造一个基于nodejs的CLI工具吧。
在完成一个命令行工具之后，javascript这种浏览器语言，终于完成全产业链(从浏览器到桌面软件再到CMD工具)的试练,成为了武林之巅，也就是世界上最好的语言 ：）
开始动手
- 配置环境
这次我们是基于nodejs来实现一个CLI工具，nodejs环境根据官网的文档一步步说明就好，NPM在公司内部需要配置代理。
首先如需要设全局代理：set http_proxy= http://dev-proxy.oa.com:8080
NPM需要设置：
npm config set proxy http://dev-proxy.oa.com:8080
- 初始化项目配置文件 package.json
进入开发目录，执行
npm init
将会创建 package.json和默认的配置。当然手动创建也没有问题。
具体配置说明- 创建和配置主入口文件
在package.js文件中，需要新增
"bin": { "node-cli": "bin/index.js" } 其中node-cli是需要执行的命令名，bin/index.js是命令所调用的文件
-
调试
到此，准备工作已经完成了，接下来我们在index.js文件中写入console.log('my first cli');
打开命令行工具，进入当前当前开发文件夹，输入
bin/index.js
则会输出my first cli 。
但是这样有些麻烦，我们如何像发布后一样，直接输node-cli命令就可以调用我们的主文件呢？
npm link
就可在目前的全局环境中创建node-cli命令，成功以后，你就可以在本机任何目录执行node-cli。
-
一些包推荐
在开发命令行过程中，我们会碰到各种问题，比如fs模块的pomise化、用户命令的复杂交互、友好的版本升级提示等等。利用npm当中的成熟库会是一个好方法，推荐几个库. -
通用CLI构建
看了这么多，也许有点迷糊？基于上面的步骤，有一个通用的CLI项目目录，集成了几个推荐的包，在clone之后迅速开始一个CLI工具的构建：
看个成品
前一段时间做了一个TG-CLI工具，大家在实现自己的CLI工具时，可拿来参考。
主要用来搭建互娱网站系统内的PC和移动专题，并根据用户输入配置页面内的基本元素，如注释、SEO信息、上报代码，并根据配置自动配置gulp，实现自动压缩、分离、补全SEO信息等。主要有这些功能：
- 用户自主配置参数
- 生成规范化目录结构
- 自动生成配置文件
- 命令包装
- 版本检查
- …
使用预览：
传送门：
在实际编写过一个CLI工具之后，我觉得除了让电脑爆炸的功能以外，什么都能实现 :)
大家多多交流：）
转载地址：http://opfqb.baihongyu.com/