@yoos/create-app

@yoos/create-app 是一款轻量、灵活的工程初始化工具，旨在帮助开发者快速创建标准化的工程模板、组件模板及业务模块，减少重复配置工作，提升项目初始化效率。支持自定义模板扩展，适配多技术栈（如 React、Vue、TypeScript 等），满足不同场景下的快速启动需求。

🌟 核心功能

• 多模板支持：内置工程模板（如 React 项目、Vue 项目、TS 工具库）、组件模板（如 UI 组件、业务组件）及模块模板（如接口请求模块、工具函数模块）。
• 零配置启动：无需手动配置webpack、eslint、babel等基础工具链，模板自带标准化配置。
• 自定义扩展：支持本地自定义模板目录，可将团队内部通用模板集成到工具中，实现标准化复用。
• 交互式选择：通过命令行交互（CLI）引导选择模板类型、技术栈、功能选项（如是否集成路由、状态管理），降低使用门槛。
• 自动依赖安装：模板创建后自动安装依赖，无需手动执行 npm install/yarn install。

📦 安装与使用

前提条件

• Node.js 版本 ≥ 16.0.0（推荐 18.x 及以上）
• npm ≥ 7.0.0 或 yarn ≥ 1.22.0

快速创建（推荐）

无需全局安装，直接通过 npx 执行命令，自动拉取最新版本工具：

# 基础用法：创建项目/组件/模块
npx @yoos/create-app

# 快捷用法：指定目标目录（若目录不存在则自动创建）
npx @yoos/create-app my-project

全局安装（可选）

若需频繁使用，可全局安装工具：

# npm 全局安装
npm install -g @yoos/create-app

# yarn 全局安装
yarn global add @yoos/create-app

# 安装后直接使用
yoos-create-app

🚀 使用流程

1. 执行命令：运行 npx @yoos/create-app 或全局命令 yoos-create-app。
2. 选择模板类型：根据交互提示选择需创建的模板类型（上下键切换，回车确认）：
   • Project：完整工程模板（如 React 单页应用、Vue 管理系统）
   • Component：组件模板（如 React 函数组件、Vue 单文件组件）
   • Module：功能模块模板（如接口请求模块、工具函数集）
3. 配置模板细节：
   • 选择技术栈（如 React 18/Vue 3、TypeScript/JavaScript）
   • 选择附加功能（如是否集成 ESLint、Prettier、路由、状态管理）
   • 输入项目/组件/模块名称（默认值可直接回车）
4. 等待创建完成：工具自动生成目录结构、复制模板文件、安装依赖。
5. 启动项目：根据终端提示执行后续命令（如启动开发服务）：

   # 进入目录
   cd my-project
   
   # 启动开发服务（命令因模板类型而异，以终端提示为准）
   npm run dev

📂 模板目录结构示例

1. 工程模板（React + TypeScript）

my-react-project/
├── public/               # 静态资源
├── src/
│   ├── components/       # 通用组件
│   ├── pages/            # 页面组件
│   ├── hooks/            # 自定义Hooks
│   ├── api/              # 接口请求
│   ├── utils/            # 工具函数
│   ├── App.tsx           # 根组件
│   └── main.tsx          # 入口文件
├── .eslintrc.js          # ESLint 配置
├── tsconfig.json         # TypeScript 配置
├── package.json          # 依赖配置
└── README.md             # 项目说明

2. 组件模板（React 函数组件）

MyButton/
├── index.tsx             # 组件逻辑
├── MyButton.tsx          # 组件实现
├── MyButton.module.css   # 组件样式（CSS Modules）
├── MyButton.types.ts     # 类型定义
└── index.ts              # 导出入口

⚙️ 自定义模板

若内置模板无法满足需求，可通过本地目录扩展自定义模板：

1. 创建自定义模板目录

在本地新建模板目录（如 ~/.yoos-templates），并按以下结构组织模板文件：

.yoos-templates/
├── project/              # 工程模板目录（对应类型 Project）
│   └── my-custom-react/  # 自定义 React 工程模板
│       ├── [模板文件...]  # 完整的项目文件结构
├── component/            # 组件模板目录（对应类型 Component）
│   └── my-vue-component/ # 自定义 Vue 组件模板
│       ├── [模板文件...]
└── module/               # 模块模板目录（对应类型 Module）
    └── my-api-module/    # 自定义接口模块模板
        ├── [模板文件...]

2. 指定自定义模板目录

执行命令时通过 --template-dir 参数指定自定义模板路径：

# 使用本地自定义模板创建项目
npx @yoos/create-app my-custom-project --template-dir ~/.yoos-templates

❌ 常见问题

1. 命令执行报错：Node.js version is too low

• 解决方案：升级 Node.js 至 16.0.0 及以上版本，推荐使用 nvm 管理 Node 版本。

2. 依赖安装失败

• 解决方案：检查网络连接，或手动进入目录执行 npm install/yarn install；若使用私有 npm 源，确保源配置正确（可通过 npm config get registry 查看）。

3. 自定义模板不生效

• 检查自定义模板目录结构是否符合规范（需对应 project/component/module 子目录）；
• 确保 --template-dir 参数路径正确（绝对路径或相对路径均可）。

📞 反馈与贡献

• 若发现 Bug 或有功能需求，可在 GitHub 仓库 提交 Issue；
• 欢迎 Fork 仓库并提交 Pull Request，共同完善工具功能。

📄 许可证

本工具基于 MIT 许可证 开源，可自由使用、修改和分发。