olova 2.0.54 → 2.0.56
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/README.md +34 -283
- package/dist/chunk-23UAGQ6N.js +2208 -0
- package/dist/chunk-23UAGQ6N.js.map +1 -0
- package/dist/chunk-D7SIC5TC.js +367 -0
- package/dist/chunk-D7SIC5TC.js.map +1 -0
- package/dist/entry-server.cjs +2341 -0
- package/dist/entry-server.cjs.map +1 -0
- package/dist/entry-server.js +114 -0
- package/dist/entry-server.js.map +1 -0
- package/dist/entry-worker.cjs +2354 -0
- package/dist/entry-worker.cjs.map +1 -0
- package/dist/entry-worker.js +126 -0
- package/dist/entry-worker.js.map +1 -0
- package/dist/main.cjs +18 -0
- package/dist/main.cjs.map +1 -0
- package/dist/main.js +16 -0
- package/dist/main.js.map +1 -0
- package/dist/olova.cjs +1684 -0
- package/dist/olova.cjs.map +1 -0
- package/dist/olova.d.cts +72 -0
- package/dist/olova.d.ts +72 -0
- package/dist/olova.js +1325 -0
- package/dist/olova.js.map +1 -0
- package/dist/performance.cjs +386 -0
- package/dist/performance.cjs.map +1 -0
- package/dist/performance.js +3 -0
- package/dist/performance.js.map +1 -0
- package/dist/router.cjs +646 -0
- package/dist/router.cjs.map +1 -0
- package/dist/router.d.cts +113 -0
- package/dist/router.d.ts +113 -0
- package/dist/router.js +632 -0
- package/dist/router.js.map +1 -0
- package/main.tsx +76 -0
- package/olova.ts +619 -0
- package/package.json +37 -55
- package/src/entry-server.tsx +165 -0
- package/src/entry-worker.tsx +201 -0
- package/src/generator/index.ts +409 -0
- package/src/hydration/flight.ts +320 -0
- package/src/hydration/index.ts +12 -0
- package/src/hydration/types.ts +225 -0
- package/src/logger.ts +182 -0
- package/src/main.tsx +24 -0
- package/src/performance.ts +488 -0
- package/src/plugin/index.ts +204 -0
- package/src/router/ErrorBoundary.tsx +145 -0
- package/src/router/Link.tsx +117 -0
- package/src/router/OlovaRouter.tsx +354 -0
- package/src/router/Outlet.tsx +8 -0
- package/src/router/context.ts +117 -0
- package/src/router/index.ts +29 -0
- package/src/router/matching.ts +63 -0
- package/src/router/router.tsx +23 -0
- package/src/router/search-params.ts +29 -0
- package/src/scanner/index.ts +116 -0
- package/src/types/index.ts +191 -0
- package/src/utils/export.ts +85 -0
- package/src/utils/index.ts +4 -0
- package/src/utils/naming.ts +54 -0
- package/src/utils/path.ts +45 -0
- package/tsup.config.ts +35 -0
- package/dist/client-BBLXpllK.d.ts +0 -487
- package/dist/client-C0av_vTZ.d.cts +0 -487
- package/dist/client.cjs +0 -850
- package/dist/client.cjs.map +0 -1
- package/dist/client.d.cts +0 -5
- package/dist/client.d.ts +0 -5
- package/dist/client.js +0 -816
- package/dist/client.js.map +0 -1
- package/dist/image.cjs +0 -25
- package/dist/image.cjs.map +0 -1
- package/dist/image.d.cts +0 -1
- package/dist/image.d.ts +0 -1
- package/dist/image.js +0 -3
- package/dist/image.js.map +0 -1
- package/dist/index.cjs +0 -907
- package/dist/index.cjs.map +0 -1
- package/dist/index.d.cts +0 -31
- package/dist/index.d.ts +0 -31
- package/dist/index.js +0 -868
- package/dist/index.js.map +0 -1
- package/dist/plugin/index.cjs +0 -1550
- package/dist/plugin/index.cjs.map +0 -1
- package/dist/plugin/index.d.cts +0 -131
- package/dist/plugin/index.d.ts +0 -131
- package/dist/plugin/index.js +0 -1490
- package/dist/plugin/index.js.map +0 -1
- package/dist/serialization-xKcOESDh.d.cts +0 -122
- package/dist/serialization-xKcOESDh.d.ts +0 -122
- package/dist/server.cjs +0 -547
- package/dist/server.cjs.map +0 -1
- package/dist/server.d.cts +0 -148
- package/dist/server.d.ts +0 -148
- package/dist/server.js +0 -493
- package/dist/server.js.map +0 -1
package/README.md
CHANGED
|
@@ -1,309 +1,60 @@
|
|
|
1
|
-
#
|
|
1
|
+
# vite-plugin-olova
|
|
2
2
|
|
|
3
|
-
A
|
|
4
|
-
|
|
5
|
-
## Features
|
|
6
|
-
|
|
7
|
-
- 🚀 **File-based routing** - Next.js-style pages directory
|
|
8
|
-
- ⚡ **Vite-powered** - Lightning fast HMR and builds
|
|
9
|
-
- 📄 **SSG & SSR** - Static generation and server-side rendering
|
|
10
|
-
- 🌊 **Streaming SSR** - React 18 streaming with Suspense
|
|
11
|
-
- 💧 **Progressive Hydration** - Flight format for efficient hydration
|
|
12
|
-
- 🔗 **Link Prefetching** - Automatic route prefetching
|
|
13
|
-
- 📱 **Dynamic Routes** - `[slug]`, `[...slug]`, `[[...slug]]` patterns
|
|
14
|
-
- 🎯 **Route Groups** - `(group)` folders for organization
|
|
3
|
+
A Vite plugin for building SSR/SSG applications with React and the Olova framework.
|
|
15
4
|
|
|
16
5
|
## Installation
|
|
17
6
|
|
|
18
7
|
```bash
|
|
19
|
-
npm install olova
|
|
20
|
-
# or
|
|
21
|
-
yarn add olova
|
|
22
|
-
# or
|
|
23
|
-
pnpm add olova
|
|
24
|
-
```
|
|
25
|
-
|
|
26
|
-
### Peer Dependencies
|
|
27
|
-
|
|
28
|
-
Olova requires the following peer dependencies:
|
|
29
|
-
|
|
30
|
-
```bash
|
|
31
|
-
npm install react react-dom vite
|
|
32
|
-
```
|
|
33
|
-
|
|
34
|
-
## Quick Start
|
|
35
|
-
|
|
36
|
-
### 1. Configure Vite
|
|
37
|
-
|
|
38
|
-
```ts
|
|
39
|
-
// vite.config.ts
|
|
40
|
-
import { defineConfig } from 'vite';
|
|
41
|
-
import react from '@vitejs/plugin-react';
|
|
42
|
-
import { olova } from 'olova';
|
|
43
|
-
|
|
44
|
-
export default defineConfig({
|
|
45
|
-
plugins: [react(), olova()],
|
|
46
|
-
});
|
|
47
|
-
```
|
|
48
|
-
|
|
49
|
-
### 2. Create Olova Config (Optional)
|
|
50
|
-
|
|
51
|
-
```ts
|
|
52
|
-
// olova.config.ts
|
|
53
|
-
import { defineConfig } from 'olova';
|
|
54
|
-
|
|
55
|
-
export default defineConfig({
|
|
56
|
-
// Enable SSG globally
|
|
57
|
-
ssg: {
|
|
58
|
-
enabled: true,
|
|
59
|
-
},
|
|
60
|
-
// Configure experimental features
|
|
61
|
-
experimental: {
|
|
62
|
-
prefetch: true,
|
|
63
|
-
},
|
|
64
|
-
});
|
|
65
|
-
```
|
|
66
|
-
|
|
67
|
-
### 3. Create Pages
|
|
68
|
-
|
|
69
|
-
Create a `src` directory with page files:
|
|
70
|
-
|
|
71
|
-
```
|
|
72
|
-
src/
|
|
73
|
-
├── layout.tsx # Root layout
|
|
74
|
-
├── page.tsx # Home page (/)
|
|
75
|
-
├── about/
|
|
76
|
-
│ └── page.tsx # About page (/about)
|
|
77
|
-
└── blog/
|
|
78
|
-
├── page.tsx # Blog index (/blog)
|
|
79
|
-
└── [slug]/
|
|
80
|
-
└── page.tsx # Blog post (/blog/:slug)
|
|
81
|
-
```
|
|
82
|
-
|
|
83
|
-
### 4. Create Layout
|
|
84
|
-
|
|
85
|
-
```tsx
|
|
86
|
-
// src/layout.tsx
|
|
87
|
-
export default function Layout({ children }: { children: React.ReactNode }) {
|
|
88
|
-
return (
|
|
89
|
-
<html>
|
|
90
|
-
<body>{children}</body>
|
|
91
|
-
</html>
|
|
92
|
-
);
|
|
93
|
-
}
|
|
94
|
-
```
|
|
95
|
-
|
|
96
|
-
### 5. Create a Page
|
|
97
|
-
|
|
98
|
-
```tsx
|
|
99
|
-
// src/page.tsx
|
|
100
|
-
import { Link } from 'olova';
|
|
101
|
-
|
|
102
|
-
export const metadata = {
|
|
103
|
-
title: 'Home',
|
|
104
|
-
description: 'Welcome to my site',
|
|
105
|
-
};
|
|
106
|
-
|
|
107
|
-
export default function HomePage() {
|
|
108
|
-
return (
|
|
109
|
-
<div>
|
|
110
|
-
<h1>Welcome</h1>
|
|
111
|
-
<Link href="/about">About</Link>
|
|
112
|
-
</div>
|
|
113
|
-
);
|
|
114
|
-
}
|
|
115
|
-
```
|
|
116
|
-
|
|
117
|
-
## Routing
|
|
118
|
-
|
|
119
|
-
### Link Component
|
|
120
|
-
|
|
121
|
-
```tsx
|
|
122
|
-
import { Link } from 'olova';
|
|
123
|
-
|
|
124
|
-
<Link href="/about">About</Link>
|
|
125
|
-
<Link href="/blog/hello" prefetch={false}>Blog Post</Link>
|
|
126
|
-
<Link href="/dashboard" replace>Dashboard</Link>
|
|
127
|
-
```
|
|
128
|
-
|
|
129
|
-
### useRouter Hook
|
|
130
|
-
|
|
131
|
-
```tsx
|
|
132
|
-
import { useRouter } from 'olova';
|
|
133
|
-
|
|
134
|
-
function MyComponent() {
|
|
135
|
-
const router = useRouter();
|
|
136
|
-
|
|
137
|
-
const handleClick = () => {
|
|
138
|
-
router.push('/dashboard');
|
|
139
|
-
};
|
|
140
|
-
|
|
141
|
-
return <button onClick={handleClick}>Go to Dashboard</button>;
|
|
142
|
-
}
|
|
143
|
-
```
|
|
144
|
-
|
|
145
|
-
### useParams Hook
|
|
146
|
-
|
|
147
|
-
```tsx
|
|
148
|
-
import { useParams } from 'olova';
|
|
149
|
-
|
|
150
|
-
// In /blog/[slug]/page.tsx
|
|
151
|
-
function BlogPost() {
|
|
152
|
-
const { slug } = useParams();
|
|
153
|
-
return <h1>Post: {slug}</h1>;
|
|
154
|
-
}
|
|
155
|
-
```
|
|
156
|
-
|
|
157
|
-
### usePathname Hook
|
|
158
|
-
|
|
159
|
-
```tsx
|
|
160
|
-
import { usePathname } from 'olova';
|
|
161
|
-
|
|
162
|
-
function Navigation() {
|
|
163
|
-
const pathname = usePathname();
|
|
164
|
-
return <nav>Current: {pathname}</nav>;
|
|
165
|
-
}
|
|
166
|
-
```
|
|
167
|
-
|
|
168
|
-
### useSearchParams Hook
|
|
169
|
-
|
|
170
|
-
```tsx
|
|
171
|
-
import { useSearchParams } from 'olova';
|
|
172
|
-
|
|
173
|
-
function SearchPage() {
|
|
174
|
-
const searchParams = useSearchParams();
|
|
175
|
-
const query = searchParams.get('q');
|
|
176
|
-
return <div>Searching for: {query}</div>;
|
|
177
|
-
}
|
|
178
|
-
```
|
|
179
|
-
|
|
180
|
-
## Static Generation
|
|
181
|
-
|
|
182
|
-
Mark pages for static generation with the `"use static"` directive:
|
|
183
|
-
|
|
184
|
-
```tsx
|
|
185
|
-
"use static";
|
|
186
|
-
|
|
187
|
-
export default function AboutPage() {
|
|
188
|
-
return <h1>About Us</h1>;
|
|
189
|
-
}
|
|
190
|
-
```
|
|
191
|
-
|
|
192
|
-
Or enable globally in `olova.config.ts`:
|
|
193
|
-
|
|
194
|
-
```ts
|
|
195
|
-
export default defineConfig({
|
|
196
|
-
ssg: {
|
|
197
|
-
enabled: true,
|
|
198
|
-
},
|
|
199
|
-
});
|
|
8
|
+
npm install vite-plugin-olova
|
|
200
9
|
```
|
|
201
10
|
|
|
202
|
-
##
|
|
11
|
+
## Usage
|
|
203
12
|
|
|
204
|
-
|
|
205
|
-
import { Head } from 'olova';
|
|
13
|
+
Add the plugin to your `vite.config.ts`:
|
|
206
14
|
|
|
207
|
-
|
|
208
|
-
|
|
209
|
-
|
|
210
|
-
|
|
211
|
-
<title>My Page</title>
|
|
212
|
-
<meta name="description" content="Page description" />
|
|
213
|
-
</Head>
|
|
214
|
-
<div>Content</div>
|
|
215
|
-
</>
|
|
216
|
-
);
|
|
217
|
-
}
|
|
218
|
-
```
|
|
219
|
-
|
|
220
|
-
Or use the `metadata` export:
|
|
221
|
-
|
|
222
|
-
```tsx
|
|
223
|
-
export const metadata = {
|
|
224
|
-
title: 'My Page',
|
|
225
|
-
description: 'Page description',
|
|
226
|
-
openGraph: {
|
|
227
|
-
title: 'My Page',
|
|
228
|
-
description: 'Page description',
|
|
229
|
-
},
|
|
230
|
-
};
|
|
231
|
-
```
|
|
232
|
-
|
|
233
|
-
## Configuration Options
|
|
234
|
-
|
|
235
|
-
```ts
|
|
236
|
-
import { defineConfig } from 'olova';
|
|
15
|
+
```typescript
|
|
16
|
+
import { defineConfig } from "vite";
|
|
17
|
+
import react from "@vitejs/plugin-react";
|
|
18
|
+
import { olova } from "vite-plugin-olova";
|
|
237
19
|
|
|
238
20
|
export default defineConfig({
|
|
239
|
-
|
|
240
|
-
|
|
241
|
-
|
|
242
|
-
|
|
243
|
-
|
|
244
|
-
|
|
245
|
-
// Enable trailing slashes
|
|
246
|
-
trailingSlash: false,
|
|
247
|
-
|
|
248
|
-
// SSG configuration
|
|
249
|
-
ssg: {
|
|
250
|
-
enabled: false,
|
|
251
|
-
prerender: ['/about', '/contact'],
|
|
252
|
-
},
|
|
253
|
-
|
|
254
|
-
// Experimental features
|
|
255
|
-
experimental: {
|
|
256
|
-
prefetch: true,
|
|
257
|
-
serverComponents: false,
|
|
258
|
-
},
|
|
259
|
-
|
|
260
|
-
// Static generation settings
|
|
261
|
-
staticGeneration: {
|
|
262
|
-
timeout: 30000,
|
|
263
|
-
fallback: 'blocking',
|
|
264
|
-
},
|
|
265
|
-
|
|
266
|
-
// Custom Vite config
|
|
267
|
-
vite: {
|
|
268
|
-
// Vite options
|
|
269
|
-
},
|
|
21
|
+
plugins: [
|
|
22
|
+
react(),
|
|
23
|
+
olova({
|
|
24
|
+
staticPaths: ["/about", "/contact"], // Optional: additional paths to pre-render
|
|
25
|
+
}),
|
|
26
|
+
],
|
|
270
27
|
});
|
|
271
28
|
```
|
|
272
29
|
|
|
273
|
-
##
|
|
30
|
+
## How It Works
|
|
274
31
|
|
|
275
|
-
|
|
32
|
+
The plugin provides:
|
|
276
33
|
|
|
277
|
-
-
|
|
278
|
-
-
|
|
279
|
-
-
|
|
280
|
-
- `Router` - Router component
|
|
281
|
-
- `useRouter` - Router hook
|
|
282
|
-
- `useParams` - Params hook
|
|
283
|
-
- `usePathname` - Pathname hook
|
|
284
|
-
- `useSearchParams` - Search params hook
|
|
285
|
-
- `navigate` - Programmatic navigation
|
|
286
|
-
- `replace` - Replace navigation
|
|
287
|
-
- `Head` - Head management component
|
|
288
|
-
- `HeadProvider` - Head context provider
|
|
289
|
-
- `usePageData` - Page data hook
|
|
34
|
+
1. **`vite-plugin-olova`** - The main Vite plugin
|
|
35
|
+
2. **`vite-plugin-olova/entry-client`** - Client-side hydration entry
|
|
36
|
+
3. **`vite-plugin-olova/entry-server`** - Server-side rendering entry
|
|
290
37
|
|
|
291
|
-
|
|
38
|
+
The entry files use `virtual:olova-app` which resolves to your app's route configuration from `@/route.tree`.
|
|
292
39
|
|
|
293
|
-
|
|
40
|
+
## Features
|
|
294
41
|
|
|
295
|
-
|
|
42
|
+
- **SSR (Server-Side Rendering)**: Full server-side rendering support during development
|
|
43
|
+
- **SSG (Static Site Generation)**: Automatically generates static HTML files at build time
|
|
44
|
+
- **Route-based code splitting**: Lazy loading for optimal performance
|
|
45
|
+
- **Hydration**: Seamless client-side hydration
|
|
296
46
|
|
|
297
|
-
|
|
47
|
+
## Options
|
|
298
48
|
|
|
299
|
-
|
|
300
|
-
|
|
301
|
-
|
|
302
|
-
- `createStreamingHeaders` - Streaming response headers
|
|
49
|
+
| Option | Type | Description |
|
|
50
|
+
| ------------- | ---------- | ----------------------------------------------- |
|
|
51
|
+
| `staticPaths` | `string[]` | Additional paths to pre-render during SSG build |
|
|
303
52
|
|
|
304
|
-
|
|
53
|
+
## Peer Dependencies
|
|
305
54
|
|
|
306
|
-
|
|
55
|
+
- `react` >= 18.0.0
|
|
56
|
+
- `react-dom` >= 18.0.0
|
|
57
|
+
- `vite` >= 5.0.0
|
|
307
58
|
|
|
308
59
|
## License
|
|
309
60
|
|