ASP源码
PHP源码
.NET源码
JSP源码
首先要确保电脑上有node.js的环境
命令行执行下面代码,初始化一个pa***ge.json
文件
npm init -y
此时,命令行执行mycli
肯定会报错。
配置自定义命令
pa***ge.json
添加bin
字段,关联mycli
命令
"bin": {
"mycli": "./***t.js"
},
/test.js
文件co***le.log("mycli命令执行成功");
install
安装命令,但是项目还没有发布到npm,所以暂时先用npm link
命令,把mycli
命令关联到全局。此时命令行再执行 mycli
就不会再报错。
脚本配置
test.js文件:
co***le.log("mycli命令执行成功");
然后再执行 mycli
,此时会出现一个提示错误的弹窗
这是因为,执行mycli
命令的时候相当于让计算机执行了这个文件,而计算机系统是无法直接执行js文件的,这就需要我们在脚本代码第一行加入一个配置,指定计算机上的node.js
程序来执行这个js脚本文件。
#!/usr/bin/env node
由于更改了执行环境,需要删除之前link到的文件,文件位置可能是C:Program Filesnodejsnode_modules
,找到mycli
删除,然后再重新执行npm link
。
现在控制台再来执行mycli
,可以看到控制台正确打印。
Chalk
命令行输出五颜六色的字体Ora
加载中loading的效果,类似的还有progress库commander
设计命令inquirer
交互功能(如:提问...)Chalk
npm install ch***@4.1.2 -S
const chalk = require("chalk"); // chalk // const hello = ch***.red("hello"); // const hello = ch***.blue.bgRed("hello"); // const hello = ch***.blue.bgYellow("hello"); const hello = ch***.rgb(200, 200, 200).bgRgb(0, 200, 3)("hello"); co***le.log(hello);
Ora
npm install or***.0.3 -S
const ora = require("ora"); // ora const spinner = ora({ text: "安装中..." }); sp***er.start(); setTimeout(() => { // sp***er.stop(); sp***er.succeed("安装成功"); // co***le.log("安装成功"); }, 2000)
start
开始加载stop
停止加载succeed
结束加载并带有成功的样式commander
开发中经常使用的命令,如vue -V
git --version
vue create
等命令,想要实现这样的命令需要用到commander这个库。
使用的命令后面带的-V
--help
等,可以理解为是命令的参数,那么我们就需要获取到这些参数,通过判断参数的不同来处理不同的事件。
那在node环境中,可以通过pr***ss.argv
来获取到这个参数。而commander库,帮助我们封装好了一些方法,不用我们自己去判断用户输入携带的指令是什么。
npm install co***[email protected] -S
const commander = require("commander"); // ... co***nder.parse(pr***ss.argv); // 放在后面
安装完成之后,commander会自动提供给我们一些命令,如--help
,下面来测试一下:
mycli --help
co***nder.version("1.0.0");
执行 mycli -V
可以看到控制台打印了 1.0.0
版本号。
自定义指令方法
co***nder.option(指令名, 描述, 回调函数)
--init
指令:co***nder.option("--init", "this is init", () => { // chalk // const hello = ch***.red("hello"); // const hello = ch***.blue.bgRed("hello"); // const hello = ch***.blue.bgYellow("hello"); const hello = ch***.rgb(200, 200, 200).bgRgb(0, 200, 3)("hello"); co***le.log(hello); // ora const spinner = ora({ text: "安装中..." }); sp***er.start(); setTimeout(() => { // sp***er.stop(); sp***er.succeed("安装成功"); // co***le.log("安装成功"); }, 1000) })
现在执行mycli --init
测试:
co***nder.option("--number", "log a number", (num) => { co***le.log(num); })
<参数名>
表示必传的参数,[参数名]
表示非必传的参数。控制台输入mycli --number 100
回车,可以看到会输出100
。
自定义命令方法
co***nder.command("create").action((projectName)=>{ co***le.log(projectName); })
执行 mycli create xx
回车,控制台可以看到 输出了xx
。
查看帮助
执行 mycli --help
,可以看到我们刚才配置的指令和命令都出现在了帮助列表里。
inquirer
npm install inquirer -S
prompt
提问的方法 in***rer.prompt([
{
type: "input",
name: "username",
message: "请输入用户名:"
}
]).then((answer)=>{
})
type
表示问题的类型,取值可能是:input
, number
, password
, editor
等。
answer
是 {username: 输入的值}
input
const inquirer = require("inquirer"); co***nder.command("add user").action(() => { in***rer.prompt([ { type: "input", name: "username", message: "请输入用户名:" } ]).then((answer) => { co***le.log(answer); }) })
confirm
co***nder.command("testcon").action(() => { in***rer.prompt([ { type: "confirm", name: "age", message: "是否大于18岁?" } ]).then((answer) => { co***le.log(answer); }) })
输入y
或n
来进行判断。
list
co***nder.command("testlist").action(() => { in***rer.prompt([ { type: "list", name: "lib", message: "选择用到的框架:", choices: [ "vue2", "vue3", "react", "svelte", ] } ]).then((answer) => { co***le.log(answer); }) })
执行 mycli testlist
命令:
download-git-repo是一个拉取代码的工具。
安装
npm install do***[email protected] -S
const downgit = require("download-git-repo");
downgit("github:kongcodes/vue3-vant", downUrl, { clone: false }, function (err) {
co***le.log(err)
})
downgit
方法里面的第一个参数理解为在github上面下载kongcodes用户的vue3-vant
项目模板。第二个参数downUrl
为要将模板下载到什么目录下。第三个参数clone
是否要用git clone
下载。第四个参数 为下载完成执行的一些事情。
command
方法使用co***nder.command("create").action((projectName) => { const spinner = ora({ text: "正在下载https://github.com/kongcodes/vue3-vant..." }); sp***er.start(); fs***dirSync(`./${projectName}`); const downUrl = `${pr***ss.cwd()}\${projectName}`; downgit("github:kongcodes/vue3-vant", downUrl, { clone: false }, function (err) { if (err) throw err; sp***er.stop(); co***le.log(ch***.green("downgit success")); }) })
执行 mycli create pro
回车,会在当前目录下创建pro
目录,下载vue3-vant
模板到这个目录里。
https://g***b.com/kongcodes/mycli