@hono-filebased-route/vite-plugin 0.3.1 → 0.5.1
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.
- package/CHANGELOG.md +8 -0
- package/README.md +169 -169
- package/build.ts +8 -10
- package/dist/index.d.ts +0 -2
- package/dist/index.js +5676 -133
- package/dist/index.js.map +7 -0
- package/package.json +54 -54
package/CHANGELOG.md
ADDED
package/README.md
CHANGED
|
@@ -1,169 +1,169 @@
|
|
|
1
|
-
# Hono File-Based Routing Vite Plugin
|
|
2
|
-
|
|
3
|
-
一个基于 Hono 框架的文件路由插件，用于 Vite 项目，支持类似 Next.js 的文件路由模式。
|
|
4
|
-
|
|
5
|
-
## 插件特性
|
|
6
|
-
|
|
7
|
-
- 🚀 **文件路由系统**: 基于文件结构自动生成路由
|
|
8
|
-
- 🔥 **热重载**: 开发时自动重新加载
|
|
9
|
-
- 📁 **动态路由**: 支持动态参数和通配符路由
|
|
10
|
-
- 🎯 **类型安全**: 完整的 TypeScript 支持
|
|
11
|
-
- 🛠️ **自动生成**: 路由配置自动生成，无需手动维护
|
|
12
|
-
|
|
13
|
-
## 路由规则
|
|
14
|
-
|
|
15
|
-
### 基本路由实例
|
|
16
|
-
|
|
17
|
-
| 文件路径 | 路由路径 | 说明 |
|
|
18
|
-
| ---------------------------------- | ------------- | ------------ |
|
|
19
|
-
| `src/routes/index.ts` | `/` | 根路由 |
|
|
20
|
-
| `src/routes/about.ts` | `/about` | 静态路由 |
|
|
21
|
-
| `src/routes/users/index.ts` | `/users` | 嵌套路由 |
|
|
22
|
-
| `src/routes/users/[id].ts` | `/users/:id` | 动态参数路由 |
|
|
23
|
-
| `src/routes/articles/[...slug].ts` | `/articles/*` | 通配符路由 |
|
|
24
|
-
|
|
25
|
-
## 安装
|
|
26
|
-
|
|
27
|
-
安装项目依赖:
|
|
28
|
-
|
|
29
|
-
```bash
|
|
30
|
-
npm install
|
|
31
|
-
# or
|
|
32
|
-
yarn add
|
|
33
|
-
# or
|
|
34
|
-
pnpm add
|
|
35
|
-
# or
|
|
36
|
-
bun add
|
|
37
|
-
```
|
|
38
|
-
|
|
39
|
-
## 使用方法
|
|
40
|
-
|
|
41
|
-
### Turborepo 命令
|
|
42
|
-
|
|
43
|
-
本项目使用 Turborepo 进行 monorepo 管理，支持以下命令：
|
|
44
|
-
|
|
45
|
-
```bash
|
|
46
|
-
# 构建所有包
|
|
47
|
-
bun run build
|
|
48
|
-
|
|
49
|
-
# 启动所有开发服务
|
|
50
|
-
bun run dev
|
|
51
|
-
|
|
52
|
-
# 运行所有测试
|
|
53
|
-
bun run test
|
|
54
|
-
|
|
55
|
-
# 类型检查
|
|
56
|
-
bun run type-check
|
|
57
|
-
|
|
58
|
-
# 清理构建产物
|
|
59
|
-
bun run clean
|
|
60
|
-
```
|
|
61
|
-
|
|
62
|
-
### 开发模式
|
|
63
|
-
|
|
64
|
-
```bash
|
|
65
|
-
# 使用 Turborepo 启动开发服务器
|
|
66
|
-
bun run dev
|
|
67
|
-
|
|
68
|
-
# 或者直接启动示例项目
|
|
69
|
-
cd examples/bun
|
|
70
|
-
bun run dev
|
|
71
|
-
```
|
|
72
|
-
|
|
73
|
-
这将启动开发服务器，支持热重载，访问 <http://localhost:3000>
|
|
74
|
-
|
|
75
|
-
### 生产模式
|
|
76
|
-
|
|
77
|
-
```bash
|
|
78
|
-
# 先构建所有包
|
|
79
|
-
bun run build
|
|
80
|
-
|
|
81
|
-
# 启动示例应用
|
|
82
|
-
cd examples/bun
|
|
83
|
-
bun run start
|
|
84
|
-
```
|
|
85
|
-
|
|
86
|
-
### 手动生成路由
|
|
87
|
-
|
|
88
|
-
```bash
|
|
89
|
-
bun run generate-routes
|
|
90
|
-
```
|
|
91
|
-
|
|
92
|
-
## 创建路由
|
|
93
|
-
|
|
94
|
-
在 `src/routes` 目录下创建 TypeScript 文件，导出 HTTP 方法处理函数：
|
|
95
|
-
|
|
96
|
-
```typescript
|
|
97
|
-
import { Context } from 'hono'
|
|
98
|
-
|
|
99
|
-
// GET 请求处理
|
|
100
|
-
export function GET(c: Context) {
|
|
101
|
-
return c.json({ message: 'Hello from GET' })
|
|
102
|
-
}
|
|
103
|
-
|
|
104
|
-
// POST 请求处理
|
|
105
|
-
export function POST(c: Context) {
|
|
106
|
-
return c.json({ message: 'Hello from POST' })
|
|
107
|
-
}
|
|
108
|
-
```
|
|
109
|
-
|
|
110
|
-
### 动态路由
|
|
111
|
-
|
|
112
|
-
使用方括号创建动态路由：
|
|
113
|
-
|
|
114
|
-
```typescript
|
|
115
|
-
import { Context } from 'hono'
|
|
116
|
-
|
|
117
|
-
export function GET(c: Context) {
|
|
118
|
-
const id = c.req.param('id')
|
|
119
|
-
return c.json({ userId: id })
|
|
120
|
-
}
|
|
121
|
-
```
|
|
122
|
-
|
|
123
|
-
### 通配符路由
|
|
124
|
-
|
|
125
|
-
使用 `[...slug]` 创建通配符路由：
|
|
126
|
-
|
|
127
|
-
该项目通过 `c.req.path` 填充 `slug` 参数，自动为 `GET/POST` 函数提供第二个参数。
|
|
128
|
-
|
|
129
|
-
```typescript
|
|
130
|
-
import { Context } from 'hono'
|
|
131
|
-
|
|
132
|
-
export function GET(c: Context, slug: string[]) {
|
|
133
|
-
return c.json({ slug })
|
|
134
|
-
}
|
|
135
|
-
```
|
|
136
|
-
|
|
137
|
-
## 工作原理
|
|
138
|
-
|
|
139
|
-
1. **路由扫描**: 插件扫描 `src/routes` 目录
|
|
140
|
-
2. **路径转换**: 将文件路径转换为 Hono 路由路径
|
|
141
|
-
3. **代码生成**: 生成 `src/generated-routes.ts` 或 `virtual:generated-routes` 文件
|
|
142
|
-
4. **自动注册**: 主应用自动注册所有生成的路由
|
|
143
|
-
|
|
144
|
-
## 开发脚本
|
|
145
|
-
|
|
146
|
-
### 包级别脚本
|
|
147
|
-
|
|
148
|
-
- `bun run build`: 构建当前包
|
|
149
|
-
- `bun run dev`: 开发模式（包含热重载）
|
|
150
|
-
- `bun run clean`: 清理构建产物
|
|
151
|
-
- `bun run generate-routes`: 生成路由配置（仅示例项目）
|
|
152
|
-
|
|
153
|
-
## 技术栈
|
|
154
|
-
|
|
155
|
-
- **[Hono](https://hono.dev/)**: 轻量级 Web 框架
|
|
156
|
-
- **[Vite](https://vitejs.dev/)**: 卓越的 Web 开发构建工具
|
|
157
|
-
- **TypeScript**: 类型安全的 JavaScript
|
|
158
|
-
|
|
159
|
-
## 许可证
|
|
160
|
-
|
|
161
|
-
MIT License
|
|
162
|
-
|
|
163
|
-
## 贡献
|
|
164
|
-
|
|
165
|
-
欢迎提交 Issue 和 Pull Request！
|
|
166
|
-
|
|
167
|
-
---
|
|
168
|
-
|
|
169
|
-
**注意**: `src/generated-routes.ts` 文件是自动生成的，请不要手动编辑。如需修改路由，请直接修改 `src/routes` 目录下的文件。
|
|
1
|
+
# Hono File-Based Routing Vite Plugin
|
|
2
|
+
|
|
3
|
+
一个基于 Hono 框架的文件路由插件，用于 Vite 项目，支持类似 Next.js 的文件路由模式。
|
|
4
|
+
|
|
5
|
+
## 插件特性
|
|
6
|
+
|
|
7
|
+
- 🚀 **文件路由系统**: 基于文件结构自动生成路由
|
|
8
|
+
- 🔥 **热重载**: 开发时自动重新加载
|
|
9
|
+
- 📁 **动态路由**: 支持动态参数和通配符路由
|
|
10
|
+
- 🎯 **类型安全**: 完整的 TypeScript 支持
|
|
11
|
+
- 🛠️ **自动生成**: 路由配置自动生成，无需手动维护
|
|
12
|
+
|
|
13
|
+
## 路由规则
|
|
14
|
+
|
|
15
|
+
### 基本路由实例
|
|
16
|
+
|
|
17
|
+
| 文件路径 | 路由路径 | 说明 |
|
|
18
|
+
| ---------------------------------- | ------------- | ------------ |
|
|
19
|
+
| `src/routes/index.ts` | `/` | 根路由 |
|
|
20
|
+
| `src/routes/about.ts` | `/about` | 静态路由 |
|
|
21
|
+
| `src/routes/users/index.ts` | `/users` | 嵌套路由 |
|
|
22
|
+
| `src/routes/users/[id].ts` | `/users/:id` | 动态参数路由 |
|
|
23
|
+
| `src/routes/articles/[...slug].ts` | `/articles/*` | 通配符路由 |
|
|
24
|
+
|
|
25
|
+
## 安装
|
|
26
|
+
|
|
27
|
+
安装项目依赖:
|
|
28
|
+
|
|
29
|
+
```bash
|
|
30
|
+
npm install
|
|
31
|
+
# or
|
|
32
|
+
yarn add
|
|
33
|
+
# or
|
|
34
|
+
pnpm add
|
|
35
|
+
# or
|
|
36
|
+
bun add
|
|
37
|
+
```
|
|
38
|
+
|
|
39
|
+
## 使用方法
|
|
40
|
+
|
|
41
|
+
### Turborepo 命令
|
|
42
|
+
|
|
43
|
+
本项目使用 Turborepo 进行 monorepo 管理，支持以下命令：
|
|
44
|
+
|
|
45
|
+
```bash
|
|
46
|
+
# 构建所有包
|
|
47
|
+
bun run build
|
|
48
|
+
|
|
49
|
+
# 启动所有开发服务
|
|
50
|
+
bun run dev
|
|
51
|
+
|
|
52
|
+
# 运行所有测试
|
|
53
|
+
bun run test
|
|
54
|
+
|
|
55
|
+
# 类型检查
|
|
56
|
+
bun run type-check
|
|
57
|
+
|
|
58
|
+
# 清理构建产物
|
|
59
|
+
bun run clean
|
|
60
|
+
```
|
|
61
|
+
|
|
62
|
+
### 开发模式
|
|
63
|
+
|
|
64
|
+
```bash
|
|
65
|
+
# 使用 Turborepo 启动开发服务器
|
|
66
|
+
bun run dev
|
|
67
|
+
|
|
68
|
+
# 或者直接启动示例项目
|
|
69
|
+
cd examples/bun
|
|
70
|
+
bun run dev
|
|
71
|
+
```
|
|
72
|
+
|
|
73
|
+
这将启动开发服务器，支持热重载，访问 <http://localhost:3000>
|
|
74
|
+
|
|
75
|
+
### 生产模式
|
|
76
|
+
|
|
77
|
+
```bash
|
|
78
|
+
# 先构建所有包
|
|
79
|
+
bun run build
|
|
80
|
+
|
|
81
|
+
# 启动示例应用
|
|
82
|
+
cd examples/bun
|
|
83
|
+
bun run start
|
|
84
|
+
```
|
|
85
|
+
|
|
86
|
+
### 手动生成路由
|
|
87
|
+
|
|
88
|
+
```bash
|
|
89
|
+
bun run generate-routes
|
|
90
|
+
```
|
|
91
|
+
|
|
92
|
+
## 创建路由
|
|
93
|
+
|
|
94
|
+
在 `src/routes` 目录下创建 TypeScript 文件，导出 HTTP 方法处理函数：
|
|
95
|
+
|
|
96
|
+
```typescript
|
|
97
|
+
import { Context } from 'hono'
|
|
98
|
+
|
|
99
|
+
// GET 请求处理
|
|
100
|
+
export function GET(c: Context) {
|
|
101
|
+
return c.json({ message: 'Hello from GET' })
|
|
102
|
+
}
|
|
103
|
+
|
|
104
|
+
// POST 请求处理
|
|
105
|
+
export function POST(c: Context) {
|
|
106
|
+
return c.json({ message: 'Hello from POST' })
|
|
107
|
+
}
|
|
108
|
+
```
|
|
109
|
+
|
|
110
|
+
### 动态路由
|
|
111
|
+
|
|
112
|
+
使用方括号创建动态路由：
|
|
113
|
+
|
|
114
|
+
```typescript
|
|
115
|
+
import { Context } from 'hono'
|
|
116
|
+
|
|
117
|
+
export function GET(c: Context) {
|
|
118
|
+
const id = c.req.param('id')
|
|
119
|
+
return c.json({ userId: id })
|
|
120
|
+
}
|
|
121
|
+
```
|
|
122
|
+
|
|
123
|
+
### 通配符路由
|
|
124
|
+
|
|
125
|
+
使用 `[...slug]` 创建通配符路由：
|
|
126
|
+
|
|
127
|
+
该项目通过 `c.req.path` 填充 `slug` 参数，自动为 `GET/POST` 函数提供第二个参数。
|
|
128
|
+
|
|
129
|
+
```typescript
|
|
130
|
+
import { Context } from 'hono'
|
|
131
|
+
|
|
132
|
+
export function GET(c: Context, slug: string[]) {
|
|
133
|
+
return c.json({ slug })
|
|
134
|
+
}
|
|
135
|
+
```
|
|
136
|
+
|
|
137
|
+
## 工作原理
|
|
138
|
+
|
|
139
|
+
1. **路由扫描**: 插件扫描 `src/routes` 目录
|
|
140
|
+
2. **路径转换**: 将文件路径转换为 Hono 路由路径
|
|
141
|
+
3. **代码生成**: 生成 `src/generated-routes.ts` 或 `virtual:generated-routes` 文件
|
|
142
|
+
4. **自动注册**: 主应用自动注册所有生成的路由
|
|
143
|
+
|
|
144
|
+
## 开发脚本
|
|
145
|
+
|
|
146
|
+
### 包级别脚本
|
|
147
|
+
|
|
148
|
+
- `bun run build`: 构建当前包
|
|
149
|
+
- `bun run dev`: 开发模式（包含热重载）
|
|
150
|
+
- `bun run clean`: 清理构建产物
|
|
151
|
+
- `bun run generate-routes`: 生成路由配置（仅示例项目）
|
|
152
|
+
|
|
153
|
+
## 技术栈
|
|
154
|
+
|
|
155
|
+
- **[Hono](https://hono.dev/)**: 轻量级 Web 框架
|
|
156
|
+
- **[Vite](https://vitejs.dev/)**: 卓越的 Web 开发构建工具
|
|
157
|
+
- **TypeScript**: 类型安全的 JavaScript
|
|
158
|
+
|
|
159
|
+
## 许可证
|
|
160
|
+
|
|
161
|
+
MIT License
|
|
162
|
+
|
|
163
|
+
## 贡献
|
|
164
|
+
|
|
165
|
+
欢迎提交 Issue 和 Pull Request！
|
|
166
|
+
|
|
167
|
+
---
|
|
168
|
+
|
|
169
|
+
**注意**: `src/generated-routes.ts` 文件是自动生成的，请不要手动编辑。如需修改路由，请直接修改 `src/routes` 目录下的文件。
|
package/build.ts
CHANGED
|
@@ -1,10 +1,8 @@
|
|
|
1
|
-
import
|
|
2
|
-
|
|
3
|
-
await
|
|
4
|
-
|
|
5
|
-
|
|
6
|
-
|
|
7
|
-
|
|
8
|
-
|
|
9
|
-
external: ['typescript'],
|
|
10
|
-
})
|
|
1
|
+
import { buildPackage } from '../../build'
|
|
2
|
+
|
|
3
|
+
await buildPackage({
|
|
4
|
+
name: '@hono-filebased-route/vite-plugin',
|
|
5
|
+
entry: './index.ts',
|
|
6
|
+
outDir: './dist',
|
|
7
|
+
external: ['typescript', 'pino', 'pino-pretty'],
|
|
8
|
+
})
|