前端开发过程中经常会用到各种各样的脚手架工具
、npm全局工具包
等命令行工具
,如:Vue脚手架@vue/cli
、React脚手架create-react-app
、node进程守卫工具pm2
、本地静态服务工具serve
、代码格式化工具prettier
等等。因此也自行开发了一套基于node
和npm
的命令行工具集,主要封装了自动化shell脚本工具
和开箱即用的Vue全家桶模板工具
。
一、全局安装
提示: tive-cli 依赖 Node.js (>=7.x)
1 | npm install tive-cli -g |
二、Vue全家桶模板工具
1.介绍
模板工具内置了Vue2.0
和Vue3.0
两个版本所对应的 Vue全家桶 模板,可根据项目需要自行选择使用。
- vue2.0+VantUI移动端模板
- vue3.0+vite2+VantUI移动端模板
2.使用
1 | 自定义目录生成 |
执行次命令后,会出现命令行交互式选择,可使用上(↑
)下(↓
)箭头进行选择,如下:
1 | E:\dev>tive create vue3-demo |
回车(enter
)确认后,会输出:
1 | E:\dev>tive create vue3-demo |
接下来就可以按照提示的命令进行操作:
1 | cd vue3-demo |
演示Demo:
- vue2.0+VantUI移动端模板:tive-vue2-mobile-demo
- vue3.0+vite2+VantUI移动端模板:tive-vue3-vite-demo
三、自动化shell脚本工具
1.介绍
脚本工具封装了两个常用的Git常用脚本命令
和自定义的shell脚本命令
,并统计了执行时长。
2.使用
2-1.Git常用脚本命令
- push当前分支代码到远程仓库
1 | tive git -b <branch> -m "commit description" |
例: push master分支代码到远程仓库
1 | tive git -b master -m "master commit" |
相当于依次执行了以下6个命令:
1 | git status |
- 当前分支合并到目标分支并push到远程仓库
1 | tive git -b <current branch> -t <target branch> -m "commit description" |
例: 将dev分支合并到test分支并push到远程仓库
1 | tive git -b dev -t test -m "dev merge" |
等价于依次执行了以下10个命令:
1 | git status |
2-2.自定义的shell脚本命令
需要在项目根目录下新建tive.config.js
,和package.json
同级
1 | // tive.config.js |
提示:
shell命令
可以根据项目需要灵活搭配,如:git命令、node命令、npm脚本命令、shell脚本命令等等。- 前端项目可以在
package.json
文件的scripts
中配置对应的npm命令
。配置例如:
1 | { |
现在就可以愉快的使用 npm run git
命令来执行脚本了。
1 | npm run git |
输出:
1 | E:\dev\vue-demo>npm run git |
四、tive-cli其他命令
- 查看
tive
的帮助信息
1 | tive |
- 查看
tive create
的帮助信息
1 | tive create |
- 查看
tive git
的帮助信息
1 | tive git |
五、TODO
tive ssh
命令:基于node
封装一套CI/CD
命令行工具,做到一行命令完成项目打包、zip压缩、文件上传、解压上线、重启服务等等一系列操作。- 规划中…
欢迎访问:天问博客
本文作者: Tiven
发布时间: 2021-12-30
最后更新: 2023-03-02
本文标题: 基于node和npm的命令行工具——tive-cli
本文链接: https://www.tiven.cn/p/d85f4546/
版权声明: 本作品采用 CC BY-NC-SA 4.0 许可协议进行许可。转载请注明出处!
发布时间: 2021-12-30
最后更新: 2023-03-02
本文标题: 基于node和npm的命令行工具——tive-cli
本文链接: https://www.tiven.cn/p/d85f4546/
版权声明: 本作品采用 CC BY-NC-SA 4.0 许可协议进行许可。转载请注明出处!