@coze-arch/cli 0.0.1-alpha.3002ee → 0.0.1-alpha.3260db

package/lib/__templates__/templates.json

@@ -3,59 +3,116 @@
   "templates": [
     {
       "name": "expo",
-      "description": "expo template",
+      "description": "Expo template for React Native applications",
       "location": "./expo",
       "paramsSchema": {
-        "appName": {
-          "type": "string",
-          "description": "Application name (lowercase, alphanumeric and hyphens only)",
-          "pattern": "^[a-z0-9-]+$"
+        "type": "object",
+        "properties": {
+          "appName": {
+            "type": "string",
+            "minLength": 1,
+            "pattern": "^[a-z0-9-]+$",
+            "description": "Application name (lowercase, alphanumeric and hyphens only)"
+          },
+          "port": {
+            "type": "number",
+            "default": 8081,
+            "minimum": 1024,
+            "maximum": 65535,
+            "description": "Metro bundler port"
+          }
         },
-        "port": {
-          "type": "number",
-          "description": "Metro bundler port",
-          "default": 8081,
-          "minimum": 1024,
-          "maximum": 65535
-        }
+        "required": [],
+        "additionalProperties": false
       }
     },
     {
       "name": "nextjs",
-      "description": "nextjs template",
+      "description": "Next.js（复杂项目）：`coze init ${COZE_WORKSPACE_PATH} --template nextjs`\n- 适用：全栈应用、复杂多页面等复杂项目\n- 使用默认nextjs项目规范\n    - **目录规范**： 默认开启src目录（打开--src-dir选项）：项目文件（如 app 目录、pages 目录、components 等）初始化到 src/ 目录下。\n    - **项目理解加速**：初始可以依赖项目下 `package.json` 文件理解项目类型，如果没有或无法理解退化成阅读其他文件。\n    - **UI设计与组件规范**：Next.js项目**必须默认**采用 shadcn/ui 风格和规范，`shadcn/ui`组件默认完整的预装在`src/components/ui/`目录下",
       "location": "./nextjs",
       "paramsSchema": {
-        "appName": {
-          "type": "string",
-          "description": "Application name (lowercase, alphanumeric and hyphens only)",
-          "pattern": "^[a-z0-9-]+$"
+        "type": "object",
+        "properties": {
+          "appName": {
+            "type": "string",
+            "minLength": 1,
+            "pattern": "^[a-z0-9-]+$",
+            "description": "Application name (lowercase, alphanumeric and hyphens only)"
+          },
+          "port": {
+            "type": "number",
+            "default": 5000,
+            "minimum": 1024,
+            "maximum": 65535,
+            "description": "Development server port (for Next.js dev server)"
+          }
         },
-        "port": {
-          "type": "number",
-          "description": "Development server port (for Next.js dev server)",
-          "default": 5000,
-          "minimum": 1024,
-          "maximum": 65535
-        }
+        "required": [],
+        "additionalProperties": false
+      }
+    },
+    {
+      "name": "taro",
+      "description": "Taro（小程序 + H5）：`coze init ${COZE_WORKSPACE_PATH} --template taro`\n- 适用：微信小程序、H5 跨端应用\n- 前后端分离架构：Taro 4 + NestJS\n- 支持微信小程序和 H5 双端构建\n- 使用 TailwindCSS + weapp-tailwindcss 实现跨端样式",
+      "location": "./taro",
+      "paramsSchema": {
+        "type": "object",
+        "properties": {
+          "appName": {
+            "type": "string",
+            "minLength": 1,
+            "pattern": "^[a-z0-9-]+$",
+            "description": "Application name (lowercase, alphanumeric and hyphens only)"
+          },
+          "port": {
+            "type": "number",
+            "default": 5000,
+            "minimum": 1024,
+            "maximum": 65535,
+            "description": "H5 development server port"
+          },
+          "serverPort": {
+            "type": "number",
+            "default": 3000,
+            "minimum": 1024,
+            "maximum": 65535,
+            "description": "NestJS backend server port"
+          }
+        },
+        "required": [],
+        "additionalProperties": false
       }
     },
     {
       "name": "vite",
-      "description": "vite template",
+      "description": "Vite（简单项目）：`coze init ${COZE_WORKSPACE_PATH} --template vite`\n- 适用：轻量级 SPA、纯前端交互、仪表盘等轻量级项目。",
       "location": "./vite",
       "paramsSchema": {
-        "appName": {
-          "type": "string",
-          "description": "Application name (lowercase, alphanumeric and hyphens only)",
-          "pattern": "^[a-z0-9-]+$"
+        "type": "object",
+        "properties": {
+          "appName": {
+            "type": "string",
+            "minLength": 1,
+            "pattern": "^[a-z0-9-]+$",
+            "description": "Application name (lowercase, alphanumeric and hyphens only)"
+          },
+          "port": {
+            "type": "number",
+            "default": 5000,
+            "minimum": 1024,
+            "maximum": 65535,
+            "description": "Development server port"
+          },
+          "hmrPort": {
+            "type": "number",
+            "default": 6000,
+            "minimum": 1024,
+            "maximum": 65535,
+            "description": "Development HMR server port"
+          }
         },
-        "port": {
-          "type": "number",
-          "description": "Development server port",
-          "default": 5000,
-          "minimum": 1024,
-          "maximum": 65535
-        }
+        "required": [],
+        "additionalProperties": false
       }
     }
   ]

package/lib/__templates__/vite/.coze

@@ -2,10 +2,11 @@
 requires = ["nodejs-24"]
 
 [dev]
-run = ["npm", "run", "dev"]
+build = ["bash", "./scripts/prepare.sh"]
+run = ["bash", "./scripts/dev.sh"]
 deps = ["git"] # -> apt install git
 
 [deploy]
-build = ["npm", "run", "build"]
-run = ["npm", "run", "start"]
+build = ["bash","./scripts/build.sh"]
+run = ["bash","./scripts/start.sh"]
 deps = ["git"] # -> apt install git

package/lib/__templates__/vite/README.md

@@ -1,61 +1,239 @@
 # <%= appName %>
 
-Vanilla TypeScript application built with Vite.
+这是一个基于 TypeScript + Vite + Tailwind CSS 的轻量级 Web 应用项目，由扣子编程 CLI 创建。
 
-## Getting Started
+## 快速开始
 
-Install dependencies:
+### 启动开发服务器
 
 ```bash
-npm install
+coze dev
 ```
 
-Start development server:
+启动后，在浏览器中打开 [http://localhost:<%= port %>](http://localhost:<%= port %>) 查看应用。
+
+开发服务器支持热更新（HMR），修改代码后页面会自动刷新。
+
+### 构建生产版本
 
 ```bash
-npm run dev
+coze build
 ```
 
-Or use coze-coding CLI:
+构建产物位于 `dist/` 目录，可直接部署到静态托管服务。
+
+### 预览生产版本
 
 ```bash
-coze-coding dev
+coze start
 ```
 
-## Build
+在本地启动一个静态服务器，预览生产构建的效果。
 
-Build for production:
+## 项目结构
 
-```bash
-npm run build
+```
+├── index.html              # HTML 入口文件
+├── src/
+│   ├── index.ts           # 应用入口（初始化）
+│   ├── main.ts            # 主逻辑文件
+│   └── index.css          # 全局样式（包含 Tailwind 指令）
+├── vite.config.ts         # Vite 配置
+├── tailwind.config.ts     # Tailwind CSS 配置
+└── tsconfig.json          # TypeScript 配置
 ```
 
-Or:
+## 核心开发规范
 
-```bash
-coze-coding build
+### 1. 样式开发
+
+**使用 Tailwind CSS**
+
+本项目使用 Tailwind CSS 进行样式开发，支持亮色/暗色模式自动切换。
+
+```typescript
+// 使用 Tailwind 工具类
+app.innerHTML = `
+  <div class="flex items-center justify-center min-h-screen bg-white dark:bg-black">
+    <h1 class="text-4xl font-bold text-black dark:text-white">
+      Hello World
+    </h1>
+  </div>
+`;
 ```
 
-## Preview
+**主题变量**
+
+主题变量定义在 `src/index.css` 中，支持自动适配系统主题：
+
+```css
+:root {
+  --background: #ffffff;
+  --foreground: #171717;
+}
+
+@media (prefers-color-scheme: dark) {
+  :root {
+    --background: #0a0a0a;
+    --foreground: #ededed;
+  }
+}
+```
 
-Preview production build:
+**常用 Tailwind 类名**
+
+- 布局：`flex`, `grid`, `container`, `mx-auto`
+- 间距：`p-4`, `m-4`, `gap-4`, `space-x-4`
+- 颜色：`bg-white`, `text-black`, `dark:bg-black`, `dark:text-white`
+- 排版：`text-lg`, `font-bold`, `leading-8`, `tracking-tight`
+- 响应式：`sm:`, `md:`, `lg:`, `xl:`
+
+### 2. 依赖管理
+
+**必须使用 pnpm 管理依赖**
 
 ```bash
-npm run preview
+# ✅ 安装依赖
+pnpm install
+
+# ✅ 添加新依赖
+pnpm add package-name
+
+# ✅ 添加开发依赖
+pnpm add -D package-name
+
+# ❌ 禁止使用 npm 或 yarn
+# npm install  # 错误！
+# yarn add     # 错误！
 ```
 
-Or:
+项目已配置 `preinstall` 脚本，使用其他包管理器会报错。
+
+### 3. TypeScript 开发
+
+**类型安全**
+
+充分利用 TypeScript 的类型系统，确保代码质量：
+
+```typescript
+// 定义接口
+interface User {
+  id: number;
+  name: string;
+  email: string;
+}
+
+// 使用类型
+function createUser(data: User): void {
+  console.log(`Creating user: ${data.name}`);
+}
+
+// DOM 操作类型推断
+const button = document.querySelector<HTMLButtonElement>('#my-button');
+if (button) {
+  button.addEventListener('click', () => {
+    console.log('Button clicked');
+  });
+}
+```
+
+**避免 any 类型**
+
+尽量避免使用 `any`，使用 `unknown` 或具体类型：
+
+```typescript
+// ❌ 不推荐
+function process(data: any) { }
+
+// ✅ 推荐
+function process(data: unknown) {
+  if (typeof data === 'string') {
+    console.log(data.toUpperCase());
+  }
+}
+```
+
+## 常见开发场景
+
+### 添加新页面
+
+本项目是单页应用（SPA），如需多页面：
+
+1. 在 `src/` 下创建新的 `.ts` 文件
+2. 在 `vite.config.ts` 中配置多入口
+3. 创建对应的 `.html` 文件
+
+### DOM 操作
+
+```typescript
+// 获取元素
+const app = document.getElementById('app');
+const button = document.querySelector<HTMLButtonElement>('.my-button');
+
+// 动态创建元素
+const div = document.createElement('div');
+div.className = 'flex items-center gap-4';
+div.textContent = 'Hello World';
+app?.appendChild(div);
+
+// 事件监听
+button?.addEventListener('click', (e) => {
+  console.log('Clicked', e);
+});
+```
+
+### 数据获取
+
+```typescript
+// Fetch API
+async function fetchData() {
+  try {
+    const response = await fetch('https://api.example.com/data');
+    const data = await response.json();
+    return data;
+  } catch (error) {
+    console.error('Failed to fetch data:', error);
+  }
+}
+
+// 使用数据
+fetchData().then(data => {
+  console.log(data);
+});
+```
+
+### 环境变量
+
+在 `.env` 文件中定义环境变量（需以 `VITE_` 开头）：
 
 ```bash
-coze-coding start
+VITE_API_URL=https://api.example.com
+```
+
+在代码中使用：
+
+```typescript
+const apiUrl = import.meta.env.VITE_API_URL;
+console.log(apiUrl); // https://api.example.com
 ```
 
-## Configuration
+## 技术栈
+
+- **构建工具**: Vite 6.x
+- **语言**: TypeScript 5.x
+- **样式**: Tailwind CSS 3.x
+- **包管理器**: pnpm 9+
+
+## 参考文档
 
-- Dev Server Port: <%= port %>
+- [Vite 官方文档](https://cn.vitejs.dev/)
+- [TypeScript 官方文档](https://www.typescriptlang.org/zh/docs/)
+- [Tailwind CSS 文档](https://tailwindcss.com/docs)
 
-## Tech Stack
+## 重要提示
 
-- TypeScript
-- Vite
-- HTML + CSS
+1. **必须使用 pnpm** 作为包管理器
+2. **使用 TypeScript** 进行类型安全开发，避免使用 `any`
+3. **使用 Tailwind CSS** 进行样式开发，支持响应式和暗色模式
+4. **环境变量必须以 `VITE_` 开头** 才能在客户端代码中访问
+5. **开发时使用 `coze dev`**，支持热更新和快速刷新

package/lib/__templates__/vite/_npmrc

@@ -1,4 +1,5 @@
-registry=https://registry.npmjs.org
+loglevel=error
+registry=https://registry.npmmirror.com
 
 strictStorePkgContentCheck=false
 verifyStoreIntegrity=false

package/lib/__templates__/vite/eslint.config.mjs

@@ -0,0 +1,9 @@
+import eslint from '@eslint/js';
+import tseslint from 'typescript-eslint';
+import { defineConfig, globalIgnores } from 'eslint/config';
+
+export default defineConfig([
+  eslint.configs.recommended,
+  ...tseslint.configs.recommended,
+  globalIgnores(['dist/**', 'node_modules/**']),
+]);

package/lib/__templates__/vite/package.json

@@ -7,18 +7,31 @@
     "dev": "bash ./scripts/dev.sh",
     "preinstall": "npx only-allow pnpm",
     "lint": "eslint",
-    "start": "bash ./scripts/start.sh"
+    "start": "bash ./scripts/start.sh",
+    "ts-check": "tsc -p tsconfig.json"
+  },
+  "dependencies": {
+    "@supabase/supabase-js": "2.95.3",
+    "dotenv": "^17.2.3"
   },
   "devDependencies": {
     "autoprefixer": "^10.4.20",
+    "coze-coding-dev-sdk": "^0.7.16",
+    "eslint": "^9",
     "only-allow": "^1.2.2",
     "postcss": "^8.4.49",
     "tailwindcss": "^3.4.17",
     "typescript": "^5.6.0",
-    "vite": "^6.0.0"
+    "typescript-eslint": "^8",
+    "vite": "^7.2.4"
   },
   "packageManager": "pnpm@9.0.0",
   "engines": {
     "pnpm": ">=9.0.0"
+  },
+  "pnpm": {
+    "overrides": {
+      "esbuild": "^0.27.2"
+    }
   }
 }