@coze-arch/cli 0.0.1-alpha.912cd5 → 0.0.1-alpha.9f719c

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (38) hide show
  1. package/lib/__templates__/expo/.coze +5 -0
  2. package/lib/__templates__/expo/.cozeproj/scripts/deploy_build.sh +25 -25
  3. package/lib/__templates__/expo/.cozeproj/scripts/deploy_run.sh +31 -56
  4. package/lib/__templates__/expo/.cozeproj/scripts/prod_build.sh +47 -0
  5. package/lib/__templates__/expo/.cozeproj/scripts/prod_run.sh +35 -0
  6. package/lib/__templates__/expo/_npmrc +1 -1
  7. package/lib/__templates__/expo/babel.config.js +10 -0
  8. package/lib/__templates__/expo/client/constants/theme.ts +10 -0
  9. package/lib/__templates__/expo/client/contexts/AuthContext.tsx +14 -107
  10. package/lib/__templates__/expo/client/hooks/useTheme.ts +1 -1
  11. package/lib/__templates__/expo/client/screens/home/index.tsx +1 -4
  12. package/lib/__templates__/expo/client/screens/home/styles.ts +1 -273
  13. package/lib/__templates__/expo/client/utils/index.ts +1 -2
  14. package/lib/__templates__/expo/metro.config.js +3 -5
  15. package/lib/__templates__/expo/package.json +8 -2
  16. package/lib/__templates__/expo/pnpm-lock.yaml +87 -5
  17. package/lib/__templates__/expo/src/index.ts +2 -2
  18. package/lib/__templates__/expo/template.config.js +1 -1
  19. package/lib/__templates__/nextjs/.coze +3 -3
  20. package/lib/__templates__/nextjs/_npmrc +1 -1
  21. package/lib/__templates__/nextjs/package.json +9 -3
  22. package/lib/__templates__/nextjs/pnpm-lock.yaml +2501 -1120
  23. package/lib/__templates__/nextjs/scripts/dev.sh +8 -27
  24. package/lib/__templates__/nextjs/src/app/layout.tsx +18 -22
  25. package/lib/__templates__/nextjs/template.config.js +1 -1
  26. package/lib/__templates__/templates.json +7 -0
  27. package/lib/__templates__/vite/.coze +3 -3
  28. package/lib/__templates__/vite/README.md +204 -26
  29. package/lib/__templates__/vite/_npmrc +1 -1
  30. package/lib/__templates__/vite/package.json +1 -1
  31. package/lib/__templates__/vite/pnpm-lock.yaml +120 -120
  32. package/lib/__templates__/vite/scripts/dev.sh +7 -26
  33. package/lib/__templates__/vite/template.config.js +10 -1
  34. package/lib/__templates__/vite/vite.config.ts +3 -3
  35. package/lib/cli.js +408 -248
  36. package/package.json +3 -2
  37. package/lib/__templates__/nextjs/.babelrc +0 -15
  38. package/lib/__templates__/nextjs/server.mjs +0 -50
@@ -4,44 +4,25 @@ set -Eeuo pipefail
4
4
  PORT=<%= port %>
5
5
  COZE_WORKSPACE_PATH="${COZE_WORKSPACE_PATH:-$(pwd)}"
6
6
  NODE_ENV=development
7
+ DEPLOY_RUN_PORT=<%= port %>
7
8
 
8
9
  cd "${COZE_WORKSPACE_PATH}"
9
10
 
10
11
  kill_port_if_listening() {
11
12
  local pids
12
-
13
- # Check if lsof is available (macOS/BSD) or ss (Linux)
14
- if command -v lsof >/dev/null 2>&1; then
15
- # macOS/BSD using lsof
16
- pids=$(lsof -ti:${PORT} 2>/dev/null || true)
17
- elif command -v ss >/dev/null 2>&1; then
18
- # Linux using ss
19
- pids=$(ss -H -lntp 2>/dev/null | awk -v port="${PORT}" '$4 ~ ":"port"$"' | grep -o 'pid=[0-9]*' | cut -d= -f2 | paste -sd' ' - || true)
20
- else
21
- echo "Warning: neither lsof nor ss found, cannot check port ${PORT}"
22
- return
23
- fi
24
-
13
+ pids=$(ss -H -lntp 2>/dev/null | awk -v port="${DEPLOY_RUN_PORT}" '$4 ~ ":"port"$"' | grep -o 'pid=[0-9]*' | cut -d= -f2 | paste -sd' ' - || true)
25
14
  if [[ -z "${pids}" ]]; then
26
- echo "Port ${PORT} is free."
15
+ echo "Port ${DEPLOY_RUN_PORT} is free."
27
16
  return
28
17
  fi
29
-
30
- echo "Port ${PORT} in use by PIDs: ${pids} (SIGKILL)"
18
+ echo "Port ${DEPLOY_RUN_PORT} in use by PIDs: ${pids} (SIGKILL)"
31
19
  echo "${pids}" | xargs -I {} kill -9 {}
32
20
  sleep 1
33
-
34
- # Verify port is cleared
35
- if command -v lsof >/dev/null 2>&1; then
36
- pids=$(lsof -ti:${PORT} 2>/dev/null || true)
37
- elif command -v ss >/dev/null 2>&1; then
38
- pids=$(ss -H -lntp 2>/dev/null | awk -v port="${PORT}" '$4 ~ ":"port"$"' | grep -o 'pid=[0-9]*' | cut -d= -f2 | paste -sd' ' - || true)
39
- fi
40
-
21
+ pids=$(ss -H -lntp 2>/dev/null | awk -v port="${DEPLOY_RUN_PORT}" '$4 ~ ":"port"$"' | grep -o 'pid=[0-9]*' | cut -d= -f2 | paste -sd' ' - || true)
41
22
  if [[ -n "${pids}" ]]; then
42
- echo "Warning: port ${PORT} still busy after SIGKILL, PIDs: ${pids}"
23
+ echo "Warning: port ${DEPLOY_RUN_PORT} still busy after SIGKILL, PIDs: ${pids}"
43
24
  else
44
- echo "Port ${PORT} cleared."
25
+ echo "Port ${DEPLOY_RUN_PORT} cleared."
45
26
  fi
46
27
  }
47
28
 
@@ -49,4 +30,4 @@ echo "Clearing port ${PORT} before start."
49
30
  kill_port_if_listening
50
31
  echo "Starting HTTP service on port ${PORT} for dev..."
51
32
 
52
- PORT=$PORT node server.mjs
33
+ npx next dev --webpack --port $PORT
@@ -1,6 +1,5 @@
1
1
  import type { Metadata } from 'next';
2
2
  import { Geist, Geist_Mono } from 'next/font/google';
3
- import { Inspector } from 'react-dev-inspector';
4
3
  import './globals.css';
5
4
 
6
5
  const geistSans = Geist({
@@ -34,9 +33,9 @@ export const metadata: Metadata = {
34
33
  ],
35
34
  authors: [{ name: 'Coze Code Team', url: 'https://code.coze.cn' }],
36
35
  generator: 'Coze Code',
37
- icons: {
38
- icon: '',
39
- },
36
+ // icons: {
37
+ // icon: '',
38
+ // },
40
39
  openGraph: {
41
40
  title: '扣子编程 | 你的 AI 工程师已就位',
42
41
  description:
@@ -45,22 +44,22 @@ export const metadata: Metadata = {
45
44
  siteName: '扣子编程',
46
45
  locale: 'zh_CN',
47
46
  type: 'website',
48
- images: [
49
- {
50
- url: '',
51
- width: 1200,
52
- height: 630,
53
- alt: '扣子编程 - 你的 AI 工程师',
54
- },
55
- ],
56
- },
57
- twitter: {
58
- card: 'summary_large_image',
59
- title: 'Coze Code | Your AI Engineer is Here',
60
- description:
61
- 'Build and deploy full-stack applications through AI conversation. No env setup, just flow.',
62
- images: [''],
47
+ // images: [
48
+ // {
49
+ // url: '',
50
+ // width: 1200,
51
+ // height: 630,
52
+ // alt: '扣子编程 - 你的 AI 工程师',
53
+ // },
54
+ // ],
63
55
  },
56
+ // twitter: {
57
+ // card: 'summary_large_image',
58
+ // title: 'Coze Code | Your AI Engineer is Here',
59
+ // description:
60
+ // 'Build and deploy full-stack applications through AI conversation. No env setup, just flow.',
61
+ // // images: [''],
62
+ // },
64
63
  robots: {
65
64
  index: true,
66
65
  follow: true,
@@ -72,14 +71,11 @@ export default function RootLayout({
72
71
  }: Readonly<{
73
72
  children: React.ReactNode;
74
73
  }>) {
75
- const isDev = process.env.NODE_ENV === 'development';
76
-
77
74
  return (
78
75
  <html lang="en">
79
76
  <body
80
77
  className={`${geistSans.variable} ${geistMono.variable} antialiased`}
81
78
  >
82
- {isDev && <Inspector />}
83
79
  {children}
84
80
  </body>
85
81
  </html>
@@ -34,7 +34,7 @@ const config = {
34
34
  // 显式定义默认参数,确保在渲染时可用
35
35
  defaultParams: {
36
36
  port: 5000,
37
- appName: 'my-nextjs-app',
37
+ appName: 'projects',
38
38
  },
39
39
 
40
40
  onBeforeRender: async context => {
@@ -55,6 +55,13 @@
55
55
  "default": 5000,
56
56
  "minimum": 1024,
57
57
  "maximum": 65535
58
+ },
59
+ "hmrPort": {
60
+ "type": "number",
61
+ "description": "Development HMR server port",
62
+ "default": 6000,
63
+ "minimum": 1024,
64
+ "maximum": 65535
58
65
  }
59
66
  }
60
67
  }
@@ -2,10 +2,10 @@
2
2
  requires = ["nodejs-24"]
3
3
 
4
4
  [dev]
5
- run = ["npm", "run", "dev"]
5
+ run = ["bash", "./scripts/dev.sh"]
6
6
  deps = ["git"] # -> apt install git
7
7
 
8
8
  [deploy]
9
- build = ["npm", "run", "build"]
10
- run = ["npm", "run", "start"]
9
+ build = ["bash","./scripts/build.sh"]
10
+ run = ["bash","./scripts/start.sh"]
11
11
  deps = ["git"] # -> apt install git
@@ -1,61 +1,239 @@
1
1
  # <%= appName %>
2
2
 
3
- Vanilla TypeScript application built with Vite.
3
+ 这是一个基于 TypeScript + Vite + Tailwind CSS 的轻量级 Web 应用项目,由扣子编程 CLI 创建。
4
4
 
5
- ## Getting Started
5
+ ## 快速开始
6
6
 
7
- Install dependencies:
7
+ ### 启动开发服务器
8
8
 
9
9
  ```bash
10
- npm install
10
+ coze dev
11
11
  ```
12
12
 
13
- Start development server:
13
+ 启动后,在浏览器中打开 [http://localhost:<%= port %>](http://localhost:<%= port %>) 查看应用。
14
+
15
+ 开发服务器支持热更新(HMR),修改代码后页面会自动刷新。
16
+
17
+ ### 构建生产版本
14
18
 
15
19
  ```bash
16
- npm run dev
20
+ coze build
17
21
  ```
18
22
 
19
- Or use coze-coding CLI:
23
+ 构建产物位于 `dist/` 目录,可直接部署到静态托管服务。
24
+
25
+ ### 预览生产版本
20
26
 
21
27
  ```bash
22
- coze-coding dev
28
+ coze start
23
29
  ```
24
30
 
25
- ## Build
31
+ 在本地启动一个静态服务器,预览生产构建的效果。
26
32
 
27
- Build for production:
33
+ ## 项目结构
28
34
 
29
- ```bash
30
- npm run build
35
+ ```
36
+ ├── index.html # HTML 入口文件
37
+ ├── src/
38
+ │ ├── index.ts # 应用入口(初始化)
39
+ │ ├── main.ts # 主逻辑文件
40
+ │ └── index.css # 全局样式(包含 Tailwind 指令)
41
+ ├── vite.config.ts # Vite 配置
42
+ ├── tailwind.config.ts # Tailwind CSS 配置
43
+ └── tsconfig.json # TypeScript 配置
31
44
  ```
32
45
 
33
- Or:
46
+ ## 核心开发规范
34
47
 
35
- ```bash
36
- coze-coding build
48
+ ### 1. 样式开发
49
+
50
+ **使用 Tailwind CSS**
51
+
52
+ 本项目使用 Tailwind CSS 进行样式开发,支持亮色/暗色模式自动切换。
53
+
54
+ ```typescript
55
+ // 使用 Tailwind 工具类
56
+ app.innerHTML = `
57
+ <div class="flex items-center justify-center min-h-screen bg-white dark:bg-black">
58
+ <h1 class="text-4xl font-bold text-black dark:text-white">
59
+ Hello World
60
+ </h1>
61
+ </div>
62
+ `;
37
63
  ```
38
64
 
39
- ## Preview
65
+ **主题变量**
66
+
67
+ 主题变量定义在 `src/index.css` 中,支持自动适配系统主题:
68
+
69
+ ```css
70
+ :root {
71
+ --background: #ffffff;
72
+ --foreground: #171717;
73
+ }
74
+
75
+ @media (prefers-color-scheme: dark) {
76
+ :root {
77
+ --background: #0a0a0a;
78
+ --foreground: #ededed;
79
+ }
80
+ }
81
+ ```
40
82
 
41
- Preview production build:
83
+ **常用 Tailwind 类名**
84
+
85
+ - 布局:`flex`, `grid`, `container`, `mx-auto`
86
+ - 间距:`p-4`, `m-4`, `gap-4`, `space-x-4`
87
+ - 颜色:`bg-white`, `text-black`, `dark:bg-black`, `dark:text-white`
88
+ - 排版:`text-lg`, `font-bold`, `leading-8`, `tracking-tight`
89
+ - 响应式:`sm:`, `md:`, `lg:`, `xl:`
90
+
91
+ ### 2. 依赖管理
92
+
93
+ **必须使用 pnpm 管理依赖**
42
94
 
43
95
  ```bash
44
- npm run preview
96
+ # 安装依赖
97
+ pnpm install
98
+
99
+ # ✅ 添加新依赖
100
+ pnpm add package-name
101
+
102
+ # ✅ 添加开发依赖
103
+ pnpm add -D package-name
104
+
105
+ # ❌ 禁止使用 npm 或 yarn
106
+ # npm install # 错误!
107
+ # yarn add # 错误!
45
108
  ```
46
109
 
47
- Or:
110
+ 项目已配置 `preinstall` 脚本,使用其他包管理器会报错。
111
+
112
+ ### 3. TypeScript 开发
113
+
114
+ **类型安全**
115
+
116
+ 充分利用 TypeScript 的类型系统,确保代码质量:
117
+
118
+ ```typescript
119
+ // 定义接口
120
+ interface User {
121
+ id: number;
122
+ name: string;
123
+ email: string;
124
+ }
125
+
126
+ // 使用类型
127
+ function createUser(data: User): void {
128
+ console.log(`Creating user: ${data.name}`);
129
+ }
130
+
131
+ // DOM 操作类型推断
132
+ const button = document.querySelector<HTMLButtonElement>('#my-button');
133
+ if (button) {
134
+ button.addEventListener('click', () => {
135
+ console.log('Button clicked');
136
+ });
137
+ }
138
+ ```
139
+
140
+ **避免 any 类型**
141
+
142
+ 尽量避免使用 `any`,使用 `unknown` 或具体类型:
143
+
144
+ ```typescript
145
+ // ❌ 不推荐
146
+ function process(data: any) { }
147
+
148
+ // ✅ 推荐
149
+ function process(data: unknown) {
150
+ if (typeof data === 'string') {
151
+ console.log(data.toUpperCase());
152
+ }
153
+ }
154
+ ```
155
+
156
+ ## 常见开发场景
157
+
158
+ ### 添加新页面
159
+
160
+ 本项目是单页应用(SPA),如需多页面:
161
+
162
+ 1. 在 `src/` 下创建新的 `.ts` 文件
163
+ 2. 在 `vite.config.ts` 中配置多入口
164
+ 3. 创建对应的 `.html` 文件
165
+
166
+ ### DOM 操作
167
+
168
+ ```typescript
169
+ // 获取元素
170
+ const app = document.getElementById('app');
171
+ const button = document.querySelector<HTMLButtonElement>('.my-button');
172
+
173
+ // 动态创建元素
174
+ const div = document.createElement('div');
175
+ div.className = 'flex items-center gap-4';
176
+ div.textContent = 'Hello World';
177
+ app?.appendChild(div);
178
+
179
+ // 事件监听
180
+ button?.addEventListener('click', (e) => {
181
+ console.log('Clicked', e);
182
+ });
183
+ ```
184
+
185
+ ### 数据获取
186
+
187
+ ```typescript
188
+ // Fetch API
189
+ async function fetchData() {
190
+ try {
191
+ const response = await fetch('https://api.example.com/data');
192
+ const data = await response.json();
193
+ return data;
194
+ } catch (error) {
195
+ console.error('Failed to fetch data:', error);
196
+ }
197
+ }
198
+
199
+ // 使用数据
200
+ fetchData().then(data => {
201
+ console.log(data);
202
+ });
203
+ ```
204
+
205
+ ### 环境变量
206
+
207
+ 在 `.env` 文件中定义环境变量(需以 `VITE_` 开头):
48
208
 
49
209
  ```bash
50
- coze-coding start
210
+ VITE_API_URL=https://api.example.com
211
+ ```
212
+
213
+ 在代码中使用:
214
+
215
+ ```typescript
216
+ const apiUrl = import.meta.env.VITE_API_URL;
217
+ console.log(apiUrl); // https://api.example.com
51
218
  ```
52
219
 
53
- ## Configuration
220
+ ## 技术栈
221
+
222
+ - **构建工具**: Vite 6.x
223
+ - **语言**: TypeScript 5.x
224
+ - **样式**: Tailwind CSS 3.x
225
+ - **包管理器**: pnpm 9+
226
+
227
+ ## 参考文档
54
228
 
55
- - Dev Server Port: <%= port %>
229
+ - [Vite 官方文档](https://cn.vitejs.dev/)
230
+ - [TypeScript 官方文档](https://www.typescriptlang.org/zh/docs/)
231
+ - [Tailwind CSS 文档](https://tailwindcss.com/docs)
56
232
 
57
- ## Tech Stack
233
+ ## 重要提示
58
234
 
59
- - TypeScript
60
- - Vite
61
- - HTML + CSS
235
+ 1. **必须使用 pnpm** 作为包管理器
236
+ 2. **使用 TypeScript** 进行类型安全开发,避免使用 `any`
237
+ 3. **使用 Tailwind CSS** 进行样式开发,支持响应式和暗色模式
238
+ 4. **环境变量必须以 `VITE_` 开头** 才能在客户端代码中访问
239
+ 5. **开发时使用 `coze dev`**,支持热更新和快速刷新
@@ -1,4 +1,4 @@
1
- registry=https://registry.npmjs.org
1
+ registry=https://registry.npmmirror.com
2
2
 
3
3
  strictStorePkgContentCheck=false
4
4
  verifyStoreIntegrity=false
@@ -15,7 +15,7 @@
15
15
  "postcss": "^8.4.49",
16
16
  "tailwindcss": "^3.4.17",
17
17
  "typescript": "^5.6.0",
18
- "vite": "^6.0.0"
18
+ "vite": "^7.2.4"
19
19
  },
20
20
  "packageManager": "pnpm@9.0.0",
21
21
  "engines": {