Create VTJ CLI 参考Create VTJ CLI 是 VTJ 项目的官方脚手架工具提供针对多种平台和用例的预配置项目模板。该 CLI 通过直观的交互界面或命令行参数处理环境设置、依赖配置和样板代码生成从而简化项目初始化流程。安装Create VTJ CLI 可以通过npm create命令模式直接调用无需显式安装。该工具以包名create-vtj发布到 npm当前版本为 0.12.19。npm create vtjlatest # 使用自定义镜像源推荐在中国地区使用以加快下载速度 npm create vtjlatest --registryhttps://registry.npmmirror.com该 CLI 会通过解析用户代理自动检测你的包管理器npm、yarn 或 pnpm并为创建的项目生成相应的安装说明。可用模板Create VTJ 提供了七种针对不同开发场景的预配置模板模板名称显示名称用途主要依赖appWeb应用具有完整 VTJ 设计器集成的 PC 端 Web 应用vtj/web, vtj/pro, vue-router, pinia, vue-i18nh5H5应用移动端优化的 Web 应用vtj/renderer, vtj/h5, vue-router, pinia, vue-i18nuniapp移动端应用跨平台移动应用微信小程序、H5、Appdcloudio/uni-app, vtj/uni-app, vue-routermaterial物料开发项目用于 VTJ 设计器的自定义组件库开发vtj/core, vtj/web, element-plusplugin低代码区块插件用于低代码引擎的可复用区块/插件vtj/core, vtj/ui, vtj/iconsextension设计器扩展开发项目设计器面板扩展和自定义组件vtj/core, vtj/pro, vueuse/corelibrary通用类库独立的工具或组件库unbuild, vitestCLI 用法交互模式不带参数运行 CLI 会启动交互式提示词序列npm create vtjlatest交互流程包含三个提示词模板选择从可用模板中选择通过颜色编码以便快速识别包名为你的项目指定 npm 包名根据 npm 命名规范进行验证覆盖确认如果目标目录存在且不为空确认是否清空其内容非交互模式为了自动化和 CI/CD 流水线可以通过直接指定模板来跳过提示词# 创建 Web 应用 npm create vtjlatest -- -t app # 创建 H5 移动端应用 npm create vtjlatest -- -t h5 # 创建 uni-app 跨平台项目 npm create vtjlatest -- -t uniapp # 创建物料开发项目 npm create vtjlatest -- -t material-t和--template标志可以互换使用。其余的提示词包名和覆盖确认仍会出现允许进行半自动化工作流程。命令行选项选项别名描述必填默认值--template-t按名称预选模板否提示词用户选择registry-用于 create 命令的 npm 镜像源否npm 官方镜像源CLI 工作流程Create VTJ CLI 遵循系统化的初始化流程架构该 CLI 实现遵循模块化架构具有清晰的关注点分离模块职责index.jsShebang 包装器用于导入并执行来自dist/index.mjs的构建模块src/index.ts主要协调器处理参数解析、验证和工作流程协调src/options.ts使用prompts库定义模板和交互式提示词配置src/generator.ts项目生成逻辑包括模板复制、package.json 定制和文件部署src/utils.ts用于验证、格式化和包管理器检测的工具函数项目生成流程生成器对选定的模板执行多项转换模板复制将所有文件从选定的模板目录递归复制到目标位置包配置读取模板的package.json使用用户提供的包名更新name字段并执行字符串替换以替换{{name}}占位符文件部署将_gitignore和_npmrc从模板根目录分别作为.gitignore和.npmrc复制到新项目中 包名验证遵循 npm 命名约定要求小写字母、数字、连字符以及可选的作用域名称格式例如scope/package-name。无效名称将在交互式提示词期间触发验证错误。生成后步骤成功创建项目后CLI 会根据检测到的包管理器显示特定于平台的后续步骤完成。现在运行 cd vtj-project npm install npm run dev对于不同的包管理器命令会相应调整npmnpm install和npm run devyarnyarn和yarn devpnpmpnpm install和pnpm run dev模板特定功能Web 应用 (app)app模板包含环境配置文件env.json、env.local.json、env.sit.json、env.uat.json和用于开发的代理配置。它提供了针对多种环境SIT、UAT、PRE、PROD的构建目标并启用了 TypeScript 类型检查。关键脚本dev本地开发环境类型设置为 localbuild:sit/uat/pre/prod特定环境的生产构建clean使用自定义清理脚本清理构建产物H5 应用 (h5)H5 模板包含具有平台特定设置的vtj配置字段vtj: { platform: h5, noMask: true }此配置启用了 H5 特定的渲染行为并在某些操作期间禁用模态覆盖层。UniApp 模板 (uniapp)uni-app 模板提供了广泛的多平台构建脚本支持App 平台Android、iOS小程序微信、支付宝、百度、京东、快手、飞书、QQ、头条WebH5 和 SSR 变体快应用多种供应商实现该模板包含每个目标平台的全面 uni-app 依赖和类型定义。物料开发 (material)物料模板生成双输出包库构建用于组件使用的 UMD 和 ESM 格式物料构建用于 VTJ 设计器集成的专用格式exports字段定义了多个入口点实现了灵活的导入策略。故障排除模板名称验证如果通过-t指定了无效的模板名称CLI 将显示错误消息并退出不会创建任何目录Error: invalid template name invalid-name有效的模板名称为app、h5、plugin、uniapp、material、extension、library。包名验证包名必须遵守 npm 命名规则必须以字母或数字开头可以包含字母、数字、连字符和下划线可以包含作用域前缀例如organization/name最大长度为 214 个字符不能包含空格或特殊字符无效名称将触发项目包名不合法请更换目录覆盖保护默认情况下CLI 会阻止覆盖非空目录。用户必须在提示词时明确确认覆盖操作。取消提示词将保留现有目录内容。后续步骤创建 VTJ 项目后建议探索以下相关文档主题创建 Web 应用app 模板项目的详细指南创建 H5 移动应用移动端特定的开发模式架构概述了解 VTJ 系统架构创建自定义物料组件物料模板项目的指南构建配置和 Vite 集成为生成的项目自定义构建流程参考资料官方文档https://vtj.pro/在线平台https://app.vtj.pro/开源仓库https://gitee.com/newgateway/vtj