YLYX CLI - 项目脚手架工具
公司内部使用的项目脚手架工具:支持交互式/命令式生成项目与代码模板,并提供 .ylyxrc.json 项目配置、环境配置切换(isDev)、以及一键部署(测试服上传/正式服打包压缩)等能力。
说明:当前部署/配置切换能力暂时只针对 Vue2 项目约定(如 .env.production 的 VUE_APP_PUBLIC_URL 等)。其它技术栈/项目结构可能需要你根据实际情况调整 .ylyxrc.json 与相关路径配置。
功能特性
- 🚀 快速生成项目代码:内置多种模板,一键生成项目/组件/模块代码
- 📦 模板化管理:模板目录结构清晰,易维护、易扩展;支持本地模板添加
- ☁️ 云端模板:支持从 GitHub/GitLab 仓库安装模板(含私有仓库 SSH 场景)
- 📝 交互式命令行:
create 支持交互式收集变量,降低使用门槛
- ⚙️ 项目配置(.ylyxrc.json):集中管理模板目录、输出目录、构建目录等配置
- 🔁 环境配置切换(isDev):提供
ylyx config dev|prod,自动同步/复制 default.js
- 🧰 初始化配置(init config):自动生成
.ylyxrc.json、config/default-*.js,并可写入 npm 前/后置脚本
- 🚚 部署(deploy):支持测试服(SFTP 上传,带上传进度)与正式服(仅压缩)两种模式,压缩包命名/顶层目录规则与
buildDir 对齐
安装
全局安装
npm install -g ylyx-cli
使用 npx(推荐,无需安装)
npx ylyx-cli create
npx ylyx-cli generate react-app -n my-project -o ./my-project
npx ylyx-cli install owner/repo
本地开发
git clone <repository>
cd ylyx-cli
npm install
npm link
使用方法
快速开始
使用交互式方式创建新项目(推荐):
ylyx create
或者直接指定模板和项目名:
ylyx generate react-app -n my-project -o ./my-project
查看可用模板
ylyx list
安装远程模板
从 GitHub/GitLab 安装模板:
ylyx install owner/repo
ylyx install https://github.com/owner/repo
ylyx install owner/repo -b develop -n my-template
添加本地模板
ylyx add template-name /path/to/template
查看模板详情
ylyx info template-name
写入配置(mode)
将当前目录的 .ylyxrc.json 写入/更新 mode(仅支持 dev / prod):
ylyx config --mode dev
ylyx config prod
初始化配置(init config)
初始化当前目录的配置文件与默认配置模板(会生成/补齐 .ylyxrc.json,并创建 config/default-dev.js、config/default-prod.js 等;默认不覆盖已有文件):
ylyx init config
ylyx init config --mode prod
ylyx init config --force
init config 还会尝试在当前目录的 package.json 中写入 npm 前置脚本(可在 .ylyxrc.json 的 preScripts 配置脚本名):
- 默认会写入
predev 和 postbuild:prod
- 执行
npm run dev 前,会自动先执行 ylyx config dev(dev 使用 symlink 实时同步)
- 执行
npm run build:prod 后,会自动执行 ylyx config prod && ylyx deploy(将 default-prod.js 复制到打包输出目录,并执行部署)
prod 输出目录规则:
- 优先使用
.ylyxrc.json 的 buildDir
- 否则读取当前项目
.env.production 的 VUE_APP_PUBLIC_URL,默认写入 <VUE_APP_PUBLIC_URL>/default.js(会去掉首尾 /)
deploy(部署)
deploy 会读取当前项目目录的 .ylyxrc.json 的 deploy 字段。
配置示例(.ylyxrc.json)
{
"mode": "dev",
"buildDir": "dist/app",
"deploy": {
"env": "test",
"host": "172.17.28.216",
"port": "22",
"username": "root",
"password": "你的密码",
"localDir": "./EXTERNAL_DIGIC",
"remoteDir": "/usr/local/nginx/html/EXTERNAL_DIGIC",
"zipAfter": false,
"zipOutDir": "./.ylyx-deploy"
}
}
行为
- 测试服:SFTP 递归上传到服务器(带上传进度)
- 正式服:不上传,仅压缩
压缩产物命名规则(正式服或 --zip):buildDir(最后一级)-YYYYMMDDHHmmss-哈希(纯字母).zip,且 zip 内顶层目录名为 buildDir 的最后一级目录名。
localDir 默认推导优先级:deploy.localDir → .env.production 的 VUE_APP_PUBLIC_URL → .ylyxrc.json 的 buildDir。
上传日志
每次执行 deploy 会在本地生成一份日志,默认在 ./.ylyx-deploy/logs/,包含上传/压缩过程与错误信息,便于追溯。
命令
ylyx deploy
ylyx deploy --env test
ylyx deploy --env prod
云端模板
模板可以放在 Git 仓库中(如 GitHub、GitLab),使用 ylyx install 命令安装。
模板仓库要求
模板仓库需要包含以下结构:
your-template/
template.json # 模板配置文件(可选)
files/ # 模板文件目录
...
示例
ylyx install github-user/react-template
ylyx install git@github.com:company/templates.git
ylyx install owner/repo -b v2.0
模板配置
模板应放在 templates/ 目录下,结构如下:
templates/
template-name/
template.json # 模板配置文件
files/ # 模板文件目录
example.js
example.css
template.json 配置示例
{
"name": "template-name",
"description": "模板描述",
"version": "1.0.0",
"variables": {
"projectName": {
"type": "input",
"message": "请输入项目名称",
"default": "my-project"
}
},
"processFiles": ["package.json", "README.md", "*.json"],
"skipFiles": ["**/*.vue", "**/*.js"]
}
配置文件
可以在项目根目录创建 .ylyxrc.json 配置文件:
{
"mode": "dev",
"publicDir": "./public",
"configDir": "./config",
"preScripts": {
"dev": "dev",
"prod": "build:prod"
},
"templatesDir": "./templates",
"outputDir": "./src",
"defaultVariables": {
"author": "Your Name",
"company": "YLYX"
}
}
示例
生成完整项目
ylyx generate react-app -n my-react-app -o ./my-react-app
cd my-react-app
npm install
npm start
License
ISC