系列文章:
- 【手把手带你撸一个脚手架】第一步, 创建第一个命令
- 【手把手带你撸一个脚手架】第二步, 搭建开发环境
- 【手把手带你撸一个脚手架】第三步, 获取 github 项目信息
- 【手把手带你撸一个脚手架】第四步, 通过撸码获取项目信息
- 【手把手带你撸一个脚手架】第五步, 撸完收工
WTF 不知道脚手架是啥? 那抓紧恶补一下前端基础把兄die, 相信不久的以后你就会回来的.
ps: 本文文件操作基于 bash, mac 同学直接用 terminal 或 iterm 即可, win 用户推荐使用 git bash
脚手架, 源自于建筑行业, 通俗的讲就是一个项目搭建的工具. 比较熟知的有 vue-cli create-react-app 等等, 这类工具通常以 xxx-cli 命名, 不废话 先甩一个 npm 战绩
小哥哥, 看看这数据, 你到底要还是不要嘛...
==================== 分割线 ====================
实现 node 和 shell 的交互
光说不练假把式, 第一步我们先跑一个自己的 node 命令
首先创建一个项目目录, 根据惯例, 我们的脚手架也叫 cli, 就叫 learn-cli 吧, 好好学习, 天天向上
mkdir learn-cli
然后, 直接 npm init -y 创建一个 node 项目
cd learn-cli
npm init -y
用你喜欢的编辑器, 打开 learn-cli 目录, 推荐 vscode, 在 package.json 中添加代码
"bin": {
"learn": "./bin/learn.js"
},
创建 bin 目录和 learn.js 文件, 在 learn.js 中添加以下代码. 文件头部的 #!/usr/bin/env node 这一句是告诉 shell 要以 node 来解析接下来的 learn 文件. 剩下的就是我们熟悉的 js 啦 ^ - ^
#!/usr/bin/env node
console.log('好好学习, 天天向上')
通过终端进入到项目的根目录执行 npm link 如果出现一下提示说明 link 成功
此时, 在命令行中输入 learn 试一下
哈哈哈哈, 熟悉的名言就这么出来啦, 出来啦....
接收命令行传来的参数
我们可以通过 process.argv 获取到启动 node 进程时传入的命令行参数
使用原生的方式获取命令好传入的参数
调整 learn.js 文件为如下:
#!/usr/bin/env node
console.log(process.argv[2] + '好好学习, 天天向上')
再次回到终端执行 learn 圈圈, 即可得到以下输出, 关于为什么要用 process.argv[2] 请参阅 文档
使用 commander 接收命令行传入的参数
使用原生的方式可以获取到传入的参数, 但是这种方式更适合简单的演示项目, 在这里我们选用社区优选的 commander 来处理参数问题, 别问我为什么这么用, 就是为了两个字 ------- 装逼
先上一个官方的栗子
#!/usr/bin/env node
const program = require('commander')
program
.version('0.0.1')
.option('-C, --chdir <path>', 'change the working directory')
.option('-c, --config <path>', 'set config path. defaults to ./deploy.conf')
.option('-T, --no-tests', 'ignore test hook')
program
.command('setup')
.description('run remote setup commands')
.action(function() {
console.log('setup');
});
program
.command('exec <cmd>')
.description('run the given remote command')
.action(function(cmd) {
console.log('exec "%s"', cmd);
});
program
.command('teardown <dir> [otherDirs...]')
.description('run teardown commands')
.action(function(dir, otherDirs) {
console.log('dir "%s"', dir);
if (otherDirs) {
otherDirs.forEach(function (oDir) {
console.log('dir "%s"', oDir);
});
}
});
program
.command('*')
.description('deploy the given env')
.action(function(env) {
console.log('deploying "%s"', env);
});
program.parse(process.argv);
首先, 安装 commander
npm i commander -S
其次将官方示例粘贴到我们的 learn.js 中, 随便执行一个命令试试learn 圈圈 learn -V, 就是这么莫名其妙的好用了.
到目前为止, 我们已经完成了万里长城第一步, 有兴趣的小伙伴可以自己尝试一下下面的步骤喲 ^ _ ^.
