README
xes-cli
前端全局脚手架工具.
参考网址
- 翻译计划-用node.js开发一个可交互的命令行应用
- 前端开发者如何拥有一个自定义的前端脚手架工具?
- Node.js命令行程序开发完整教程
- 手把手教你用node撸一个图片压缩工具
- 获取 TinyPNG 免费的 API key
项目脚手架安装说明
$ npm install -g xes-cli
常规使用
初始准备:
1. 在 git 上面新建一个仓库
2. 通过 git clone git地址 将项目下载到本地
3. cd 进入项目文件夹
// 选择项目脚手架模板方式
$ xes init
// 快捷拉取脚手架方式
$ xes init <template-name>
Example:
$ xes init vue
个人本地新增项目脚手架模板
- 因项目工具模板为内部项目,故需要添加为项目开发者,且通过 ssh免密方式才可拉取项目代码。
个人开发者可以通过 xes add 命令添加自己的项目脚手架模板,拉取代码不受限制,。
$ xes init [templateName] // 通过 xes init + 脚手架名称 来拉取对应项目模板代码.
$ xes show // 显示所有脚手架模板
$ xes add // 添加新的脚手架模板
$ xes remove // 删除指定的脚手架模板
$ xes update // 升级全局的 xes-cli 到最新版本
$ xes tree [level] [ignoreFile] // 自动化文件目录结构生成
$ xes imageMin -k [tinyKey] -p [imagePath] -o [outPath] // TinyPNG图片压缩工具
- 新增 xes imageMin 使用说明:
$ xes imageMin // 直接压缩当前文件夹下所有图片,并覆盖原图
$ xes imageMin -k 'tinyKey' // 首次使用需设置 TinyPNG 的key, 会自动保存到配置文件
$ xes imageMin -p './images' // 指定需要压缩的图片文件夹,使用相对路径
$ xes imageMin -o './output' // 指定压缩后的图片保存位置,保留原图
$ xes imageMin -f './images/demo.png' // 单独压缩某一张图片,写相对路径
参数说明:
所有参数可级联使用,依次在后面添加即可(文件夹会忽略 node_modules ,防止误操作)
-k, --key [key] : TinyPNG 的key,免费的每个月可压缩 500张
-p, --path [path]: 指定需要压缩的图片文件夹,使用相对路径 ,会遍历内部所有文件及文件夹
-o, --out [path]: 指定压缩后的图片保存位置,目录结构与压缩文件夹完全一致
-f, --file [path]: 单独压缩某一张图片 ,相对路径
xes tree 使用说明:
$ xes tree // 自动化文件目录结构生成
$ xes tree 1 // 只遍历第一级文件目录
$ xes tree 0 'docs|test' // 需要忽略的文件夹或者文件 以 '|' 来链接
注:
level: 变量目录的深度,初始值 0,默认遍历全部目录
ignoreFile:需要忽略的文件夹或者文件,默认已忽略 node_modules、dist 和 特殊字符开头的文件(例 . )
添加项目脚手架模板相关参数说明
{
"short": "vue", // 项目脚手架仓库名称简写
"value": "xes-template-vue", // 项目脚手架仓库名称
"name": "通用@vue/cli 3移动端模板,不带vuex", // 项目脚手架在 init 显示的名称
"description": "移动端脚手架工具,采用 @vue/cli 3 框架", // 项目脚手架的相关描述
"gitUrl": "https://github.com/liuyun012/Js_frame.git" // 项目脚手架的git 仓库地址
},