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