前端工程化简单实现

初始化工作

• cd ~/Documents/fcc/ mkdir cli-test && cd cli-test && npm init -y
• 在 package.json 里面加一句： "bin": {"liuhao": "./index.js"}
• 在 ./index.js 最顶上加一句 #!/usr/bin/env node
• 在当前package.json目录下，执行npm link，将当前的代码在npm全局目录下留个快捷方式，创建一个软连接。npm检测到pakage.json里面存在一个bin字段，它就同时在全局npm包目录下生成了一个可执行文件,同样的 npm unlink可以解除这个软连接
• 接着我们就可以测试一下我们的cli命令是否生效，在命令行输入liuhao 回车：

参数读取

在我们使用别的成熟的 cli 工具时都是可以往里面传递参数的比如webpack --mode development，我们也可以在代码里面接收我们自己cli的参数 这里会用到一个东西： process，我们可以在 "./index.js" 文件直接输出这个 console.log(process.arvg):

[ '/usr/local/bin/node', '/usr/local/bin/liuhao' ] 可以看到process.arvg是一个数组(前两个元素是固定的，分别是node程序的路径和脚本存放的位置)，从第三位开始才是额外输入的内容

我们更改命令为 liuhao fcc，再看输出：

[ '/usr/local/bin/node', '/usr/local/bin/liuhao', 'fcc' ] 可以看到在 process.arvg 上面挂上了我们传递进来的参数

npm社区中也有一些优秀的命令行参数解析包，比如yargs,commander.js等，如果想使用较复杂的参数或者命令，建议用第三方包，手写解析太麻烦

命令行交互

用到inquirer: npm i -S inquirer 当我们知道用户输入的是什么的时候，我们就可以通过node的一些api将对应的项目模板给拷贝过来

包的发布

之前我们在本地是通过 npm link 来运行我们的命令的，现在我们做好一个 cli 工具的时候，我们需要将包给发布到 npm 的官网上面 - npm adduser - npm login(logout) - npm whoami - npm publish --access=public 我们执行npm unlink 这个时候我们的命令就不生效了，这个时候 我们安装我们发布上去的包 npm i -g liuhao,这时我们又可以运行我们的命令了