Skip to content

Commit 4e7c509

Browse files
committed
feat: 添加 Vite+ 迁移相关文档和技能文件
添加 Vite+ 迁移计划和清理计划文档 创建相关技能文件用于 README 生成和主题开发
1 parent 845a33b commit 4e7c509

File tree

5 files changed

+319
-0
lines changed

5 files changed

+319
-0
lines changed
Lines changed: 146 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,146 @@
1+
# Vite+ 迁移后续清理计划
2+
3+
## 任务概述
4+
5+
完成 Vite+ 迁移后的清理工作:
6+
7+
1. 移除 Biome,使用 Vite+ 内置的 lint/fmt,迁移配置
8+
2. 移除 Lefthook,使用 Vite+ 内置的 git hooks
9+
3. 更新 README 文档中的示例代码
10+
11+
---
12+
13+
## Phase 1: 迁移 Biome 配置到 Vite+
14+
15+
### 1.1 分析 Biome 配置
16+
17+
当前 `biome.jsonc` 配置:
18+
19+
- **Formatter**: 单引号、无分号、2空格缩进、80字符行宽
20+
- **Linter**: recommended 规则 + 自定义规则
21+
- **Files**: 包含/排除模式
22+
- **JavaScript**: JSX 单引号、尾随逗号
23+
24+
### 1.2 更新 vite.config.ts
25+
26+
将 Biome 配置迁移到 `vite.config.ts``lint``fmt` block:
27+
28+
```typescript
29+
import { defineConfig } from 'vite-plus'
30+
31+
export default defineConfig({
32+
test: {
33+
environment: 'happy-dom',
34+
},
35+
lint: {
36+
// 迁移 Biome linter 规则
37+
},
38+
fmt: {
39+
// 迁移 Biome formatter 配置
40+
quoteStyle: 'single',
41+
semicolons: 'asNeeded', // 无分号
42+
indentStyle: 'space',
43+
indentWidth: 2,
44+
lineWidth: 80,
45+
},
46+
})
47+
```
48+
49+
### 1.3 删除 Biome 相关文件和依赖
50+
51+
- 删除 `biome.jsonc`
52+
-`package.json` devDependencies 移除 `@biomejs/biome`
53+
-`pnpm-workspace.yaml` catalog 移除 `@biomejs/biome`
54+
55+
---
56+
57+
## Phase 2: 迁移 Git Hooks 到 Vite+
58+
59+
### 2.1 配置 Vite+ Git Hooks
60+
61+
运行 `vp config --hooks` 配置 git hooks(或手动配置)
62+
63+
### 2.2 删除 Lefthook 相关文件和依赖
64+
65+
- 删除 `lefthook.yml`
66+
-`package.json` 移除 `prepare` script 中的 `lefthook install`
67+
-`package.json` devDependencies 移除 `lefthook`
68+
-`pnpm-workspace.yaml` catalog 移除 `lefthook`
69+
-`pnpm-workspace.yaml` onlyBuiltDependencies 移除 `lefthook`
70+
71+
---
72+
73+
## Phase 3: 更新 README 文档
74+
75+
### 3.1 更新 packages/tona-vite/README.md
76+
77+
将示例代码中的导入从 `vite` 改为 `vite-plus`
78+
79+
```typescript
80+
// 修改前
81+
import { defineConfig } from 'vite'
82+
83+
// 修改后
84+
import { defineConfig } from 'vite-plus'
85+
```
86+
87+
需要更新的位置:
88+
89+
- 第 41 行
90+
- 第 52 行
91+
- 第 112 行
92+
93+
### 3.2 更新 packages/tona-vite/README.zh-CN.md
94+
95+
同样更新三处导入:
96+
97+
- 第 41 行
98+
- 第 52 行
99+
- 第 112 行
100+
101+
---
102+
103+
## Phase 4: 清理依赖
104+
105+
### 4.1 更新 package.json
106+
107+
移除:
108+
109+
- `@biomejs/biome` from devDependencies
110+
- `lefthook` from devDependencies
111+
- `prepare` script 中的 `lefthook install`(或替换为 Vite+ hooks)
112+
113+
### 4.2 更新 pnpm-workspace.yaml
114+
115+
移除:
116+
117+
- `@biomejs/biome` from catalog
118+
- `lefthook` from catalog
119+
- `lefthook` from onlyBuiltDependencies
120+
121+
---
122+
123+
## Phase 5: 验证
124+
125+
运行验证命令:
126+
127+
```bash
128+
vp install
129+
vp check
130+
vp test
131+
vp build (或 vp pack)
132+
```
133+
134+
---
135+
136+
## 执行顺序
137+
138+
1. 更新 `vite.config.ts` 添加 lint/fmt 配置
139+
2. 更新 `package.json` 移除依赖和更新 scripts
140+
3. 更新 `pnpm-workspace.yaml` 移除依赖
141+
4. 删除 `biome.jsonc`
142+
5. 删除 `lefthook.yml`
143+
6. 更新 README 文档
144+
7. 运行 `vp install`
145+
8. 运行 `vp config --hooks` 配置 git hooks
146+
9. 运行验证命令
Lines changed: 172 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,172 @@
1+
# Vite+ 迁移计划
2+
3+
## 项目概述
4+
5+
这是一个使用 pnpm workspace 的 monorepo 项目,包含多个 packages 和 themes。
6+
7+
### 当前工具链
8+
9+
- **Vite**: ^8.0.0 (catalog)
10+
- **Vitest**: ^4.1.0 (catalog)
11+
- **Biome**: 用于 linting 和 formatting
12+
- **Lefthook**: Git hooks
13+
- **tsdown**: 库构建工具
14+
15+
### 项目结构
16+
17+
- 根目录: `vitest.config.ts`, `biome.jsonc`, `lefthook.yml`
18+
- Packages: 多个子包,部分有独立的 `vitest.config.ts`
19+
- Themes: 多个主题,使用 `vite.config.ts`
20+
21+
---
22+
23+
## 迁移步骤
24+
25+
### Phase 1: 预迁移检查
26+
27+
1. **验证 Vite 和 Vitest 版本**
28+
- 确认 Vite >= 8.0.0 ✓ (catalog: `^8.0.0`)
29+
- 确认 Vitest >= 4.1.0 ✓ (catalog: `^4.1.0`)
30+
31+
### Phase 2: 执行迁移命令
32+
33+
2. **运行 Vite+ 迁移命令**
34+
35+
```bash
36+
vp migrate --no-interactive
37+
```
38+
39+
- 这将自动处理大部分迁移工作
40+
- 创建 `vite.config.ts` 并整合配置
41+
42+
### Phase 3: 验证导入重写
43+
44+
3. **检查 `vite` 导入重写**
45+
需要检查的文件:
46+
- `packages/plugins/vite.config.ts`
47+
- `packages/create-tona/template-minimal/vite.config.ts`
48+
- `packages/create-tona/template-preact/vite.config.ts`
49+
- `themes/shadcn/vite.config.ts`
50+
- `themes/geek/vite.config.ts`
51+
- `themes/reacg/vite.config.ts`
52+
- `packages/tona-vite/src/index.ts` (类型导入)
53+
54+
预期变更: `from 'vite'``from 'vite-plus'`
55+
56+
4. **检查 `vitest` 导入重写**
57+
需要检查的测试文件:
58+
- `packages/create-tona/test/consts.test.ts`
59+
- `packages/create-tona/test/utils/package.test.ts`
60+
- `packages/create-tona/test/utils/fs.test.ts`
61+
- `packages/create-tona/test/strategies/package-manager.test.ts`
62+
- `packages/create-tona/test/core/context.test.ts`
63+
- `packages/options/test/index.test.ts`
64+
- `packages/core/tests/integration.test.ts`
65+
- `packages/core/tests/createThemeApi.test.ts`
66+
- `packages/stylelint-one-utility-class-per-line/__tests__/index.test.mjs`
67+
- `packages/core/tests/shared.test.ts`
68+
- `packages/core/tests/defineOptions.test.ts`
69+
70+
预期变更: `from 'vitest'``from 'vite-plus/test'`
71+
72+
### Phase 4: 配置整合
73+
74+
5. **整合配置到 vite.config.ts**
75+
-`vitest.config.ts` 配置合并到 `vite.config.ts` 的 test block
76+
-`biome.jsonc` 配置迁移到 `vite.config.ts` 的 lint/fmt block
77+
- 移除独立的配置文件(如果迁移后不再需要)
78+
79+
6. **更新 package.json scripts**
80+
当前 scripts:
81+
82+
```json
83+
{
84+
"dev": "node scripts/dev-theme.ts",
85+
"build:theme": "node scripts/build-theme.ts",
86+
"build:pkg": "pnpm -r --filter=./packages/** --parallel run build",
87+
"docs:dev": "pnpm -C docs run dev",
88+
"docs:build": "pnpm -C docs run build",
89+
"typecheck": "vue-tsc --noEmit",
90+
"release": "tsx scripts/release.ts",
91+
"publish-ci": "tsx scripts/publish-ci.ts",
92+
"test": "vitest test",
93+
"lint": "pnpm exec biome check --write",
94+
"prepare": "lefthook install"
95+
}
96+
```
97+
98+
需要更新的命令映射:
99+
- `test`: `vitest test` → 使用 `vp test`
100+
- `lint`: `pnpm exec biome check --write` → 使用 `vp lint`
101+
- 新增 `fmt`: 使用 `vp fmt`
102+
- 新增 `check`: 使用 `vp check` (组合了 fmt, lint, typecheck)
103+
104+
### Phase 5: 清理旧依赖
105+
106+
7. **移除旧依赖**(确认重写后)
107+
-`devDependencies` 移除 `vite``vitest`
108+
- 从 catalog 移除相关版本定义
109+
- 移除 `@vitest/ui` 如果不再需要
110+
111+
8. **清理配置文件**
112+
- 删除根目录 `vitest.config.ts`
113+
- 删除 `packages/create-tona/vitest.config.ts`
114+
- 删除 `packages/options/vitest.config.ts`
115+
- 可能需要删除或保留 `biome.jsonc`(取决于 Vite+ 是否完全接管)
116+
- 可能需要删除或保留 `lefthook.yml`(取决于 Vite+ hooks 配置)
117+
118+
### Phase 6: 验证迁移
119+
120+
9. **运行验证命令**
121+
```bash
122+
vp install # 安装依赖
123+
vp check # 运行格式化、lint 和类型检查
124+
vp test # 运行测试
125+
vp build # 构建项目
126+
```
127+
128+
---
129+
130+
## 注意事项
131+
132+
### 特殊文件处理
133+
134+
1. **README 文件中的示例代码**
135+
- `packages/tona-vite/README.md`
136+
- `packages/tona-vite/README.zh-CN.md`
137+
- 这些是文档示例,可能不需要修改,或需要更新以反映新的导入方式
138+
139+
2. **模板文件**
140+
- `packages/create-tona/template-minimal/vite.config.ts`
141+
- `packages/create-tona/template-preact/vite.config.ts`
142+
- 这些是项目模板,需要确保迁移后模板仍然可用
143+
144+
3. **类型导入**
145+
- `packages/tona-vite/src/index.ts` 使用了 `import type { ... } from 'vite'`
146+
- 需要确认类型导入是否也需要更新
147+
148+
### 子包配置
149+
150+
- 某些 packages 使用 `tsdown.config.ts` 而非 `vite.config.ts`
151+
- 这些可能不受 Vite+ 迁移影响,但需要验证
152+
153+
---
154+
155+
## 预期结果
156+
157+
迁移完成后:
158+
159+
1. 统一使用 `vite.config.ts` 作为主配置文件
160+
2. 使用 `vp` 命令替代分散的工具命令
161+
3. 简化依赖管理
162+
4. 保持项目功能不变
163+
164+
---
165+
166+
## 回滚方案
167+
168+
如果迁移出现问题:
169+
170+
1. 恢复 git 中被修改的文件
171+
2. 重新安装依赖: `pnpm install`
172+
3. 检查并恢复必要的配置文件
File renamed without changes.

.trae/skills/vite-plus

Lines changed: 1 addition & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1 @@
1+
../../node_modules/vite-plus/skills/vite-plus

0 commit comments

Comments
 (0)