vite-react-ssg 0.6.0 → 0.6.2
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 +11 -6
- package/dist/client/single-page.cjs +1 -1
- package/dist/client/single-page.d.cts +2 -2
- package/dist/client/single-page.d.mts +2 -2
- package/dist/client/single-page.d.ts +2 -2
- package/dist/client/single-page.mjs +2 -2
- package/dist/index.cjs +1 -1
- package/dist/index.d.cts +2 -2
- package/dist/index.d.mts +2 -2
- package/dist/index.d.ts +2 -2
- package/dist/index.mjs +2 -2
- package/dist/node/cli.cjs +9 -38
- package/dist/node/cli.mjs +8 -37
- package/dist/node.cjs +203 -310
- package/dist/node.d.cts +2 -2
- package/dist/node.d.mts +2 -2
- package/dist/node.d.ts +2 -2
- package/dist/node.mjs +204 -309
- package/dist/shared/{vite-react-ssg.d734eb79.d.ts → vite-react-ssg.870c683b.d.cts} +3 -3
- package/dist/shared/{vite-react-ssg.d734eb79.d.cts → vite-react-ssg.870c683b.d.mts} +3 -3
- package/dist/shared/{vite-react-ssg.d734eb79.d.mts → vite-react-ssg.870c683b.d.ts} +3 -3
- package/dist/shared/{vite-react-ssg.8cdb31f1.mjs → vite-react-ssg.a292c181.mjs} +4 -2
- package/dist/shared/{vite-react-ssg.c639b3fe.cjs → vite-react-ssg.c1d49976.cjs} +4 -2
- package/package.json +14 -12
package/README.md
CHANGED
|
@@ -4,6 +4,8 @@ Static-site generation for React on Vite.
|
|
|
4
4
|
|
|
5
5
|
See demo(also document): [docs](https://vite-react-ssg.netlify.app/)
|
|
6
6
|
|
|
7
|
+
**🎈 Support for [`@tanstack/router`](https://tanstack.com/router/latest/docs/framework/react/overview) and [`wouter`](https://github.com/molefrog/wouter) is in progress!**
|
|
8
|
+
|
|
7
9
|
[](https://www.npmjs.com/package/vite-react-ssg)
|
|
8
10
|
|
|
9
11
|
# Table of contents
|
|
@@ -13,6 +15,7 @@ See demo(also document): [docs](https://vite-react-ssg.netlify.app/)
|
|
|
13
15
|
- [Extra route options](#extra-route-options)
|
|
14
16
|
- [`entry`](#entry)
|
|
15
17
|
- [`getStaticPaths`](#getstaticpaths)
|
|
18
|
+
- [Data fetch](#data-fetch)
|
|
16
19
|
- [lazy](#lazy)
|
|
17
20
|
- [`<ClientOnly/>`](#clientonly)
|
|
18
21
|
- [Document head](#document-head)
|
|
@@ -135,7 +138,8 @@ The RouteObject of vite-react-ssg is based on react-router, and vite-react-ssg r
|
|
|
135
138
|
|
|
136
139
|
#### `entry`
|
|
137
140
|
|
|
138
|
-
Used to obtain static resources.If you introduce static resources (such as css files) in that route and use lazy loading (such as React.lazy or route.lazy), you should set the entry field.
|
|
141
|
+
Used to obtain static resources.If you introduce static resources (such as css files) in that route and use lazy loading (such as React.lazy or route.lazy), you should set the entry field.
|
|
142
|
+
It should be the path from root to the target file.
|
|
139
143
|
|
|
140
144
|
eg: `src/pages/page1.tsx`
|
|
141
145
|
|
|
@@ -187,6 +191,12 @@ const routes = [
|
|
|
187
191
|
|
|
188
192
|
See [example](./examples/lazy-pages/src/App.tsx).
|
|
189
193
|
|
|
194
|
+
## Data fetch
|
|
195
|
+
|
|
196
|
+
You can use react-router-dom's `loader` to fetch data at build time and use `useLoaderData` to get the data in the component.
|
|
197
|
+
|
|
198
|
+
See [example | with-loader](./examples/with-loader/src/pages/[docs].tsx).
|
|
199
|
+
|
|
190
200
|
## `<ClientOnly/>`
|
|
191
201
|
|
|
192
202
|
If you need to render some component in browser only, you can wrap your component with `<ClientOnly>`.
|
|
@@ -520,10 +530,6 @@ export default {
|
|
|
520
530
|
}
|
|
521
531
|
```
|
|
522
532
|
|
|
523
|
-
### Https
|
|
524
|
-
|
|
525
|
-
If you set `https` to true in Vite, we will by default use `devcert` to generate a local HTTPS service for you. Of course, if you pass in your own custom https parameters, we will also help you pass them through to the Express server.
|
|
526
|
-
|
|
527
533
|
```ts
|
|
528
534
|
export default defineConfig({
|
|
529
535
|
server: {
|
|
@@ -539,7 +545,6 @@ export default defineConfig({
|
|
|
539
545
|
- [x] SSR in dev environment
|
|
540
546
|
- [x] More Client components, such as `<ClientOnly />`
|
|
541
547
|
- [x] `getStaticPaths` for dynamic routes
|
|
542
|
-
- [ ] Initial State
|
|
543
548
|
|
|
544
549
|
## Credits
|
|
545
550
|
|
|
@@ -3,7 +3,7 @@
|
|
|
3
3
|
const client = require('react-dom/client');
|
|
4
4
|
const reactHelmetAsync = require('react-helmet-async');
|
|
5
5
|
const React = require('react');
|
|
6
|
-
const ClientOnly = require('../shared/vite-react-ssg.
|
|
6
|
+
const ClientOnly = require('../shared/vite-react-ssg.c1d49976.cjs');
|
|
7
7
|
const state = require('../shared/vite-react-ssg.e6991406.cjs');
|
|
8
8
|
|
|
9
9
|
function _interopDefaultCompat (e) { return e && typeof e === 'object' && 'default' in e ? e.default : e; }
|
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
import { ReactNode } from 'react';
|
|
2
|
-
import { V as ViteReactSSGContext, a as ViteReactSSGClientOptions } from '../shared/vite-react-ssg.
|
|
3
|
-
export { I as IndexRouteRecord, N as NonIndexRouteRecord, R as RouteRecord, c as RouterOptions, S as StyleCollector, b as ViteReactSSGOptions } from '../shared/vite-react-ssg.
|
|
2
|
+
import { V as ViteReactSSGContext, a as ViteReactSSGClientOptions } from '../shared/vite-react-ssg.870c683b.cjs';
|
|
3
|
+
export { I as IndexRouteRecord, N as NonIndexRouteRecord, R as RouteRecord, c as RouterOptions, S as StyleCollector, b as ViteReactSSGOptions } from '../shared/vite-react-ssg.870c683b.cjs';
|
|
4
4
|
export { C as ClientOnly, H as Head } from '../shared/vite-react-ssg.faf3855a.cjs';
|
|
5
5
|
import 'critters';
|
|
6
6
|
import 'react-router-dom';
|
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
import { ReactNode } from 'react';
|
|
2
|
-
import { V as ViteReactSSGContext, a as ViteReactSSGClientOptions } from '../shared/vite-react-ssg.
|
|
3
|
-
export { I as IndexRouteRecord, N as NonIndexRouteRecord, R as RouteRecord, c as RouterOptions, S as StyleCollector, b as ViteReactSSGOptions } from '../shared/vite-react-ssg.
|
|
2
|
+
import { V as ViteReactSSGContext, a as ViteReactSSGClientOptions } from '../shared/vite-react-ssg.870c683b.mjs';
|
|
3
|
+
export { I as IndexRouteRecord, N as NonIndexRouteRecord, R as RouteRecord, c as RouterOptions, S as StyleCollector, b as ViteReactSSGOptions } from '../shared/vite-react-ssg.870c683b.mjs';
|
|
4
4
|
export { C as ClientOnly, H as Head } from '../shared/vite-react-ssg.faf3855a.mjs';
|
|
5
5
|
import 'critters';
|
|
6
6
|
import 'react-router-dom';
|
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
import { ReactNode } from 'react';
|
|
2
|
-
import { V as ViteReactSSGContext, a as ViteReactSSGClientOptions } from '../shared/vite-react-ssg.
|
|
3
|
-
export { I as IndexRouteRecord, N as NonIndexRouteRecord, R as RouteRecord, c as RouterOptions, S as StyleCollector, b as ViteReactSSGOptions } from '../shared/vite-react-ssg.
|
|
2
|
+
import { V as ViteReactSSGContext, a as ViteReactSSGClientOptions } from '../shared/vite-react-ssg.870c683b.js';
|
|
3
|
+
export { I as IndexRouteRecord, N as NonIndexRouteRecord, R as RouteRecord, c as RouterOptions, S as StyleCollector, b as ViteReactSSGOptions } from '../shared/vite-react-ssg.870c683b.js';
|
|
4
4
|
export { C as ClientOnly, H as Head } from '../shared/vite-react-ssg.faf3855a.js';
|
|
5
5
|
import 'critters';
|
|
6
6
|
import 'react-router-dom';
|
|
@@ -1,8 +1,8 @@
|
|
|
1
1
|
import { createRoot, hydrateRoot } from 'react-dom/client';
|
|
2
2
|
import { HelmetProvider } from 'react-helmet-async';
|
|
3
3
|
import React from 'react';
|
|
4
|
-
import { d as documentReady } from '../shared/vite-react-ssg.
|
|
5
|
-
export { C as ClientOnly, H as Head } from '../shared/vite-react-ssg.
|
|
4
|
+
import { d as documentReady } from '../shared/vite-react-ssg.a292c181.mjs';
|
|
5
|
+
export { C as ClientOnly, H as Head } from '../shared/vite-react-ssg.a292c181.mjs';
|
|
6
6
|
import { d as deserializeState } from '../shared/vite-react-ssg.a009fbf1.mjs';
|
|
7
7
|
|
|
8
8
|
function ViteReactSSG(App, fn, options = {}) {
|
package/dist/index.cjs
CHANGED
|
@@ -4,7 +4,7 @@ const React = require('react');
|
|
|
4
4
|
const client = require('react-dom/client');
|
|
5
5
|
const reactHelmetAsync = require('react-helmet-async');
|
|
6
6
|
const reactRouterDom = require('react-router-dom');
|
|
7
|
-
const ClientOnly = require('./shared/vite-react-ssg.
|
|
7
|
+
const ClientOnly = require('./shared/vite-react-ssg.c1d49976.cjs');
|
|
8
8
|
const state = require('./shared/vite-react-ssg.e6991406.cjs');
|
|
9
9
|
|
|
10
10
|
function _interopDefaultCompat (e) { return e && typeof e === 'object' && 'default' in e ? e.default : e; }
|
package/dist/index.d.cts
CHANGED
|
@@ -1,5 +1,5 @@
|
|
|
1
|
-
import { c as RouterOptions, V as ViteReactSSGContext, a as ViteReactSSGClientOptions } from './shared/vite-react-ssg.
|
|
2
|
-
export { I as IndexRouteRecord, N as NonIndexRouteRecord, R as RouteRecord, S as StyleCollector, b as ViteReactSSGOptions } from './shared/vite-react-ssg.
|
|
1
|
+
import { c as RouterOptions, V as ViteReactSSGContext, a as ViteReactSSGClientOptions } from './shared/vite-react-ssg.870c683b.cjs';
|
|
2
|
+
export { I as IndexRouteRecord, N as NonIndexRouteRecord, R as RouteRecord, S as StyleCollector, b as ViteReactSSGOptions } from './shared/vite-react-ssg.870c683b.cjs';
|
|
3
3
|
export { C as ClientOnly, H as Head } from './shared/vite-react-ssg.faf3855a.cjs';
|
|
4
4
|
import React from 'react';
|
|
5
5
|
import { LinkProps, NavLinkProps } from 'react-router-dom';
|
package/dist/index.d.mts
CHANGED
|
@@ -1,5 +1,5 @@
|
|
|
1
|
-
import { c as RouterOptions, V as ViteReactSSGContext, a as ViteReactSSGClientOptions } from './shared/vite-react-ssg.
|
|
2
|
-
export { I as IndexRouteRecord, N as NonIndexRouteRecord, R as RouteRecord, S as StyleCollector, b as ViteReactSSGOptions } from './shared/vite-react-ssg.
|
|
1
|
+
import { c as RouterOptions, V as ViteReactSSGContext, a as ViteReactSSGClientOptions } from './shared/vite-react-ssg.870c683b.mjs';
|
|
2
|
+
export { I as IndexRouteRecord, N as NonIndexRouteRecord, R as RouteRecord, S as StyleCollector, b as ViteReactSSGOptions } from './shared/vite-react-ssg.870c683b.mjs';
|
|
3
3
|
export { C as ClientOnly, H as Head } from './shared/vite-react-ssg.faf3855a.mjs';
|
|
4
4
|
import React from 'react';
|
|
5
5
|
import { LinkProps, NavLinkProps } from 'react-router-dom';
|
package/dist/index.d.ts
CHANGED
|
@@ -1,5 +1,5 @@
|
|
|
1
|
-
import { c as RouterOptions, V as ViteReactSSGContext, a as ViteReactSSGClientOptions } from './shared/vite-react-ssg.
|
|
2
|
-
export { I as IndexRouteRecord, N as NonIndexRouteRecord, R as RouteRecord, S as StyleCollector, b as ViteReactSSGOptions } from './shared/vite-react-ssg.
|
|
1
|
+
import { c as RouterOptions, V as ViteReactSSGContext, a as ViteReactSSGClientOptions } from './shared/vite-react-ssg.870c683b.js';
|
|
2
|
+
export { I as IndexRouteRecord, N as NonIndexRouteRecord, R as RouteRecord, S as StyleCollector, b as ViteReactSSGOptions } from './shared/vite-react-ssg.870c683b.js';
|
|
3
3
|
export { C as ClientOnly, H as Head } from './shared/vite-react-ssg.faf3855a.js';
|
|
4
4
|
import React from 'react';
|
|
5
5
|
import { LinkProps, NavLinkProps } from 'react-router-dom';
|
package/dist/index.mjs
CHANGED
|
@@ -2,8 +2,8 @@ import React, { forwardRef } from 'react';
|
|
|
2
2
|
import { createRoot, hydrateRoot } from 'react-dom/client';
|
|
3
3
|
import { HelmetProvider } from 'react-helmet-async';
|
|
4
4
|
import { useLinkClickHandler, Link as Link$1, NavLink as NavLink$1, matchRoutes, createBrowserRouter, RouterProvider } from 'react-router-dom';
|
|
5
|
-
import { d as documentReady } from './shared/vite-react-ssg.
|
|
6
|
-
export { C as ClientOnly, H as Head } from './shared/vite-react-ssg.
|
|
5
|
+
import { d as documentReady } from './shared/vite-react-ssg.a292c181.mjs';
|
|
6
|
+
export { C as ClientOnly, H as Head } from './shared/vite-react-ssg.a292c181.mjs';
|
|
7
7
|
import { d as deserializeState } from './shared/vite-react-ssg.a009fbf1.mjs';
|
|
8
8
|
|
|
9
9
|
const Link = forwardRef((props, ref) => {
|
package/dist/node/cli.cjs
CHANGED
|
@@ -3,8 +3,8 @@
|
|
|
3
3
|
const kolorist = require('kolorist');
|
|
4
4
|
const yargs = require('yargs');
|
|
5
5
|
const helpers = require('yargs/helpers');
|
|
6
|
-
const webFetch = require('@remix-run/web-fetch');
|
|
7
6
|
const node = require('../node.cjs');
|
|
7
|
+
const webFetch = require('@remix-run/web-fetch');
|
|
8
8
|
require('node:path');
|
|
9
9
|
require('node:module');
|
|
10
10
|
require('fs-extra');
|
|
@@ -16,48 +16,16 @@ require('react');
|
|
|
16
16
|
require('react-helmet-async');
|
|
17
17
|
require('node:stream');
|
|
18
18
|
require('react-dom/server');
|
|
19
|
-
require('node:https');
|
|
20
|
-
require('express');
|
|
21
|
-
require('@childrentime/devcert');
|
|
22
19
|
|
|
23
20
|
function _interopDefaultCompat (e) { return e && typeof e === 'object' && 'default' in e ? e.default : e; }
|
|
24
21
|
|
|
25
22
|
const yargs__default = /*#__PURE__*/_interopDefaultCompat(yargs);
|
|
26
23
|
|
|
27
|
-
class NodeRequest extends webFetch.Request {
|
|
28
|
-
constructor(info, init) {
|
|
29
|
-
super(info, init);
|
|
30
|
-
}
|
|
31
|
-
get headers() {
|
|
32
|
-
return super.headers;
|
|
33
|
-
}
|
|
34
|
-
clone() {
|
|
35
|
-
return new NodeRequest(this);
|
|
36
|
-
}
|
|
37
|
-
}
|
|
38
|
-
class NodeResponse extends webFetch.Response {
|
|
39
|
-
get headers() {
|
|
40
|
-
return super.headers;
|
|
41
|
-
}
|
|
42
|
-
clone() {
|
|
43
|
-
return super.clone();
|
|
44
|
-
}
|
|
45
|
-
}
|
|
46
|
-
const fetch = (info, init) => {
|
|
47
|
-
init = {
|
|
48
|
-
// Disable compression handling so people can return the result of a fetch
|
|
49
|
-
// directly in the loader without messing with the Content-Encoding header.
|
|
50
|
-
compress: false,
|
|
51
|
-
...init
|
|
52
|
-
};
|
|
53
|
-
return webFetch.fetch(info, init);
|
|
54
|
-
};
|
|
55
|
-
|
|
56
24
|
function installGlobals() {
|
|
57
25
|
global.Headers = webFetch.Headers;
|
|
58
|
-
global.Request =
|
|
59
|
-
global.Response =
|
|
60
|
-
global.fetch = fetch;
|
|
26
|
+
global.Request = webFetch.Request;
|
|
27
|
+
global.Response = webFetch.Response;
|
|
28
|
+
global.fetch = webFetch.fetch;
|
|
61
29
|
global.FormData = webFetch.FormData;
|
|
62
30
|
}
|
|
63
31
|
|
|
@@ -101,10 +69,13 @@ yargs__default(helpers.hideBin(process.argv)).scriptName("vite-react-ssg").usage
|
|
|
101
69
|
alias: "b",
|
|
102
70
|
type: "string",
|
|
103
71
|
describe: "The base path to render"
|
|
72
|
+
}).option("host", {
|
|
73
|
+
type: "boolean",
|
|
74
|
+
describe: "The host to expose"
|
|
104
75
|
}),
|
|
105
76
|
async (args) => {
|
|
106
|
-
const { config: configFile = void 0, ...ssgOptions } = args;
|
|
107
|
-
await node.dev(ssgOptions, { configFile });
|
|
77
|
+
const { config: configFile = void 0, host, ...ssgOptions } = args;
|
|
78
|
+
await node.dev(ssgOptions, { configFile, server: { host } });
|
|
108
79
|
}
|
|
109
80
|
).fail((msg, err, yargs2) => {
|
|
110
81
|
console.error(`
|
package/dist/node/cli.mjs
CHANGED
|
@@ -1,8 +1,8 @@
|
|
|
1
1
|
import { gray, bold, red, reset, underline } from 'kolorist';
|
|
2
2
|
import yargs from 'yargs';
|
|
3
3
|
import { hideBin } from 'yargs/helpers';
|
|
4
|
-
import { Request, Response, fetch as fetch$1, Headers, FormData } from '@remix-run/web-fetch';
|
|
5
4
|
import { build, dev } from '../node.mjs';
|
|
5
|
+
import { Headers, Request, Response, fetch, FormData } from '@remix-run/web-fetch';
|
|
6
6
|
import 'node:path';
|
|
7
7
|
import 'node:module';
|
|
8
8
|
import 'fs-extra';
|
|
@@ -14,43 +14,11 @@ import 'react';
|
|
|
14
14
|
import 'react-helmet-async';
|
|
15
15
|
import 'node:stream';
|
|
16
16
|
import 'react-dom/server';
|
|
17
|
-
import 'node:https';
|
|
18
|
-
import 'express';
|
|
19
|
-
import '@childrentime/devcert';
|
|
20
|
-
|
|
21
|
-
class NodeRequest extends Request {
|
|
22
|
-
constructor(info, init) {
|
|
23
|
-
super(info, init);
|
|
24
|
-
}
|
|
25
|
-
get headers() {
|
|
26
|
-
return super.headers;
|
|
27
|
-
}
|
|
28
|
-
clone() {
|
|
29
|
-
return new NodeRequest(this);
|
|
30
|
-
}
|
|
31
|
-
}
|
|
32
|
-
class NodeResponse extends Response {
|
|
33
|
-
get headers() {
|
|
34
|
-
return super.headers;
|
|
35
|
-
}
|
|
36
|
-
clone() {
|
|
37
|
-
return super.clone();
|
|
38
|
-
}
|
|
39
|
-
}
|
|
40
|
-
const fetch = (info, init) => {
|
|
41
|
-
init = {
|
|
42
|
-
// Disable compression handling so people can return the result of a fetch
|
|
43
|
-
// directly in the loader without messing with the Content-Encoding header.
|
|
44
|
-
compress: false,
|
|
45
|
-
...init
|
|
46
|
-
};
|
|
47
|
-
return fetch$1(info, init);
|
|
48
|
-
};
|
|
49
17
|
|
|
50
18
|
function installGlobals() {
|
|
51
19
|
global.Headers = Headers;
|
|
52
|
-
global.Request =
|
|
53
|
-
global.Response =
|
|
20
|
+
global.Request = Request;
|
|
21
|
+
global.Response = Response;
|
|
54
22
|
global.fetch = fetch;
|
|
55
23
|
global.FormData = FormData;
|
|
56
24
|
}
|
|
@@ -95,10 +63,13 @@ yargs(hideBin(process.argv)).scriptName("vite-react-ssg").usage("$0 [args]").com
|
|
|
95
63
|
alias: "b",
|
|
96
64
|
type: "string",
|
|
97
65
|
describe: "The base path to render"
|
|
66
|
+
}).option("host", {
|
|
67
|
+
type: "boolean",
|
|
68
|
+
describe: "The host to expose"
|
|
98
69
|
}),
|
|
99
70
|
async (args) => {
|
|
100
|
-
const { config: configFile = void 0, ...ssgOptions } = args;
|
|
101
|
-
await dev(ssgOptions, { configFile });
|
|
71
|
+
const { config: configFile = void 0, host, ...ssgOptions } = args;
|
|
72
|
+
await dev(ssgOptions, { configFile, server: { host } });
|
|
102
73
|
}
|
|
103
74
|
).fail((msg, err, yargs2) => {
|
|
104
75
|
console.error(`
|