toiljs 0.0.12 → 0.0.15

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 (41) hide show
  1. package/README.md +1 -1
  2. package/build/cli/.tsbuildinfo +1 -1
  3. package/build/cli/index.js +2926 -191
  4. package/build/client/.tsbuildinfo +1 -1
  5. package/build/client/head/metadata.d.ts +3 -1
  6. package/build/client/head/metadata.js +8 -0
  7. package/build/client/index.d.ts +4 -4
  8. package/build/client/index.js +2 -2
  9. package/build/client/navigation/navigation.d.ts +2 -0
  10. package/build/client/navigation/navigation.js +9 -1
  11. package/build/client/routing/loader.d.ts +2 -0
  12. package/build/compiler/.tsbuildinfo +1 -1
  13. package/build/compiler/config.d.ts +2 -0
  14. package/build/compiler/config.js +1 -0
  15. package/build/compiler/generate.js +10 -1
  16. package/build/compiler/index.js +2 -0
  17. package/build/compiler/prerender.js +1 -0
  18. package/build/compiler/seo.d.ts +1 -1
  19. package/build/compiler/seo.js +3 -2
  20. package/build/compiler/ssg.d.ts +5 -0
  21. package/build/compiler/ssg.js +90 -0
  22. package/examples/basic/client/routes/search.tsx +61 -61
  23. package/package.json +4 -3
  24. package/src/client/head/metadata.ts +112 -94
  25. package/src/client/index.ts +89 -79
  26. package/src/client/navigation/navigation.ts +235 -215
  27. package/src/client/routing/loader.ts +10 -0
  28. package/src/client/search/search.ts +189 -189
  29. package/src/client/search/use-page-search.ts +73 -73
  30. package/src/compiler/config.ts +182 -173
  31. package/src/compiler/generate.ts +394 -378
  32. package/src/compiler/index.ts +3 -0
  33. package/src/compiler/pages.ts +2 -2
  34. package/src/compiler/prerender.ts +156 -152
  35. package/src/compiler/seo.ts +390 -381
  36. package/src/compiler/ssg.ts +126 -0
  37. package/test/dom/error-overlay.test.tsx +44 -44
  38. package/test/dom/router-loading.test.tsx +1 -1
  39. package/test/dom/use-metadata.test.tsx +58 -0
  40. package/test/seo.test.ts +164 -164
  41. package/test/ssg.test.ts +36 -0
@@ -6,6 +6,7 @@ import { startBackend, type RunningBackend } from 'toiljs/backend';
6
6
 
7
7
  import { loadConfig } from './config.js';
8
8
  import { generate } from './generate.js';
9
+ import { prerenderStaticParams } from './ssg.js';
9
10
  import { createViteConfig } from './vite.js';
10
11
 
11
12
  export interface ToilCommandOptions {
@@ -28,6 +29,8 @@ export async function build(opts: ToilCommandOptions = {}): Promise<void> {
28
29
  const cfg = await loadConfig(opts);
29
30
  generate(cfg);
30
31
  await viteBuild(await createViteConfig(cfg));
32
+ // SSG: bake per-URL HTML + sitemap for dynamic routes that opt in via `generateStaticParams`.
33
+ await prerenderStaticParams(cfg);
31
34
  }
32
35
 
33
36
  /**
@@ -22,7 +22,7 @@ export interface PageIndexEntry {
22
22
 
23
23
  /**
24
24
  * Loads the project's TypeScript synchronously (so {@link buildPageIndex} can run inside the sync
25
- * `generate()`), or `null` if it isn't installed in which case pages are indexed by path only.
25
+ * `generate()`), or `null` if it isn't installed, in which case pages are indexed by path only.
26
26
  */
27
27
  function loadTypeScriptSync(root: string): Ts | null {
28
28
  try {
@@ -41,7 +41,7 @@ function isDynamic(pattern: string): boolean {
41
41
 
42
42
  /**
43
43
  * Builds the searchable page index from the scanned routes: every main-tree page (slots and
44
- * intercepting routes are excluded they don't own a distinct URL) paired with its statically
44
+ * intercepting routes are excluded, they don't own a distinct URL) paired with its statically
45
45
  * extracted `metadata`. A route may also `export const searchHints` (a static `title`/`description`/
46
46
  * `keywords` object) to feed the index even when its real metadata is dynamic (`generateMetadata`);
47
47
  * hints are merged over the static `metadata`, winning ties. Reads each route file once.
@@ -1,152 +1,156 @@
1
- import { createRequire } from 'node:module';
2
- import fs from 'node:fs';
3
- import path from 'node:path';
4
- import { pathToFileURL } from 'node:url';
5
-
6
- import type * as TS from 'typescript';
7
- import type { Plugin } from 'vite';
8
-
9
- import { type ResolvedToilConfig } from './config.js';
10
- import { scanRoutes } from './routes.js';
11
- import { injectSeoHtml, routeSeo } from './seo.js';
12
-
13
- type Ts = typeof TS;
14
-
15
- /** Loads the project's TypeScript (used to read each route's static `metadata`), or `null` if absent. */
16
- async function loadTypeScript(root: string): Promise<Ts | null> {
17
- try {
18
- const resolved = createRequire(path.join(root, 'package.json')).resolve('typescript');
19
- const mod = (await import(pathToFileURL(resolved).href)) as { default?: Ts } & Ts;
20
- return mod.default ?? mod;
21
- } catch {
22
- return null;
23
- }
24
- }
25
-
26
- /** Marks an AST node that isn't a static literal (so its value can't be baked at build). */
27
- const UNRESOLVED = Symbol('unresolved');
28
-
29
- /** Statically evaluates a literal expression node to a JS value, or `UNRESOLVED` if it isn't one. */
30
- function evalNode(ts: Ts, node: TS.Expression): unknown {
31
- if (ts.isStringLiteral(node) || ts.isNoSubstitutionTemplateLiteral(node)) return node.text;
32
- if (ts.isNumericLiteral(node)) return Number(node.text);
33
- if (node.kind === ts.SyntaxKind.TrueKeyword) return true;
34
- if (node.kind === ts.SyntaxKind.FalseKeyword) return false;
35
- if (node.kind === ts.SyntaxKind.NullKeyword) return null;
36
- if (ts.isArrayLiteralExpression(node)) {
37
- const out: unknown[] = [];
38
- for (const el of node.elements) {
39
- const value = evalNode(ts, el);
40
- if (value === UNRESOLVED) return UNRESOLVED;
41
- out.push(value);
42
- }
43
- return out;
44
- }
45
- if (ts.isObjectLiteralExpression(node)) return evalObject(ts, node);
46
- return UNRESOLVED;
47
- }
48
-
49
- /** Evaluates an object literal to a plain object, skipping any property that isn't a static literal. */
50
- function evalObject(ts: Ts, node: TS.ObjectLiteralExpression): Record<string, unknown> {
51
- const obj: Record<string, unknown> = {};
52
- for (const prop of node.properties) {
53
- if (!ts.isPropertyAssignment(prop)) continue;
54
- const key = ts.isIdentifier(prop.name)
55
- ? prop.name.text
56
- : ts.isStringLiteral(prop.name)
57
- ? prop.name.text
58
- : null;
59
- if (key === null) continue;
60
- const value = evalNode(ts, prop.initializer);
61
- if (value !== UNRESOLVED) obj[key] = value;
62
- }
63
- return obj;
64
- }
65
-
66
- /**
67
- * Extracts the named `export const <name> = { … }` object-literal exports from a route file in a
68
- * single parse, returning the statically-evaluable subset of each (dynamic and computed values are
69
- * skipped). Names that are absent or not object literals are omitted from the result.
70
- */
71
- export function extractStaticExports(
72
- ts: Ts,
73
- filePath: string,
74
- names: readonly string[],
75
- ): Record<string, Record<string, unknown>> {
76
- let source: string;
77
- try {
78
- source = fs.readFileSync(filePath, 'utf8');
79
- } catch {
80
- return {};
81
- }
82
- const wanted = new Set(names);
83
- const out: Record<string, Record<string, unknown>> = {};
84
- const sf = ts.createSourceFile(
85
- filePath,
86
- source,
87
- ts.ScriptTarget.Latest,
88
- true,
89
- ts.ScriptKind.TSX,
90
- );
91
- for (const stmt of sf.statements) {
92
- if (!ts.isVariableStatement(stmt)) continue;
93
- if (!stmt.modifiers?.some((m) => m.kind === ts.SyntaxKind.ExportKeyword)) continue;
94
- for (const decl of stmt.declarationList.declarations) {
95
- if (
96
- ts.isIdentifier(decl.name) &&
97
- wanted.has(decl.name.text) &&
98
- !(decl.name.text in out) &&
99
- decl.initializer &&
100
- ts.isObjectLiteralExpression(decl.initializer)
101
- ) {
102
- out[decl.name.text] = evalObject(ts, decl.initializer);
103
- }
104
- }
105
- }
106
- return out;
107
- }
108
-
109
- /**
110
- * Extracts a route's `export const metadata = { … }` if it's a static object literal, returning the
111
- * statically-evaluable subset (dynamic `generateMetadata` and computed values are skipped). `null`
112
- * when the file has no static metadata.
113
- */
114
- export function extractStaticMetadata(ts: Ts, filePath: string): Record<string, unknown> | null {
115
- return extractStaticExports(ts, filePath, ['metadata']).metadata ?? null;
116
- }
117
-
118
- /**
119
- * Build-only plugin that statically pre-renders per-route HTML for SEO. After the bundle is written,
120
- * it takes the built shell (`index.html`), and for each static route bakes that route's
121
- * `metadata` (merged over the site-wide `seo` defaults) into a `<route>/index.html` so a JS-less
122
- * crawler hitting the route gets correct per-page tags. Dynamic (`generateMetadata`) and `:param`
123
- * routes are skipped (no data at build) and fall back to the client-rendered shell.
124
- */
125
- export function prerenderPlugin(cfg: ResolvedToilConfig): Plugin {
126
- return {
127
- name: 'toil:prerender-seo',
128
- apply: 'build',
129
- async closeBundle() {
130
- if (!cfg.seo) return;
131
- const outDir = path.resolve(cfg.root, cfg.outDir);
132
- const shellPath = path.join(outDir, 'index.html');
133
- if (!fs.existsSync(shellPath)) return;
134
- const shell = fs.readFileSync(shellPath, 'utf8');
135
- const ts = await loadTypeScript(cfg.root);
136
-
137
- const routes = scanRoutes(cfg.routesAbsDir).filter(
138
- (r) => r.slot === undefined && !r.intercept && !/[:*]/.test(r.pattern),
139
- );
140
- for (const route of routes) {
141
- const metadata = ts ? extractStaticMetadata(ts, route.file) : null;
142
- const html = injectSeoHtml(shell, routeSeo(cfg.seo, metadata, route.pattern));
143
- const target =
144
- route.pattern === '/'
145
- ? shellPath
146
- : path.join(outDir, route.pattern.replace(/^\//, ''), 'index.html');
147
- fs.mkdirSync(path.dirname(target), { recursive: true });
148
- fs.writeFileSync(target, html);
149
- }
150
- },
151
- };
152
- }
1
+ import { createRequire } from 'node:module';
2
+ import fs from 'node:fs';
3
+ import path from 'node:path';
4
+ import { pathToFileURL } from 'node:url';
5
+
6
+ import type * as TS from 'typescript';
7
+ import type { Plugin } from 'vite';
8
+
9
+ import { type ResolvedToilConfig } from './config.js';
10
+ import { scanRoutes } from './routes.js';
11
+ import { injectSeoHtml, routeSeo } from './seo.js';
12
+
13
+ type Ts = typeof TS;
14
+
15
+ /** Loads the project's TypeScript (used to read each route's static `metadata`), or `null` if absent. */
16
+ async function loadTypeScript(root: string): Promise<Ts | null> {
17
+ try {
18
+ const resolved = createRequire(path.join(root, 'package.json')).resolve('typescript');
19
+ const mod = (await import(pathToFileURL(resolved).href)) as { default?: Ts } & Ts;
20
+ return mod.default ?? mod;
21
+ } catch {
22
+ return null;
23
+ }
24
+ }
25
+
26
+ /** Marks an AST node that isn't a static literal (so its value can't be baked at build). */
27
+ const UNRESOLVED = Symbol('unresolved');
28
+
29
+ /** Statically evaluates a literal expression node to a JS value, or `UNRESOLVED` if it isn't one. */
30
+ function evalNode(ts: Ts, node: TS.Expression): unknown {
31
+ if (ts.isStringLiteral(node) || ts.isNoSubstitutionTemplateLiteral(node)) return node.text;
32
+ if (ts.isNumericLiteral(node)) return Number(node.text);
33
+ if (node.kind === ts.SyntaxKind.TrueKeyword) return true;
34
+ if (node.kind === ts.SyntaxKind.FalseKeyword) return false;
35
+ if (node.kind === ts.SyntaxKind.NullKeyword) return null;
36
+ if (ts.isArrayLiteralExpression(node)) {
37
+ const out: unknown[] = [];
38
+ for (const el of node.elements) {
39
+ const value = evalNode(ts, el);
40
+ if (value === UNRESOLVED) return UNRESOLVED;
41
+ out.push(value);
42
+ }
43
+ return out;
44
+ }
45
+ if (ts.isObjectLiteralExpression(node)) return evalObject(ts, node);
46
+ return UNRESOLVED;
47
+ }
48
+
49
+ /** Evaluates an object literal to a plain object, skipping any property that isn't a static literal. */
50
+ function evalObject(ts: Ts, node: TS.ObjectLiteralExpression): Record<string, unknown> {
51
+ const obj: Record<string, unknown> = {};
52
+ for (const prop of node.properties) {
53
+ if (!ts.isPropertyAssignment(prop)) continue;
54
+ const key = ts.isIdentifier(prop.name)
55
+ ? prop.name.text
56
+ : ts.isStringLiteral(prop.name)
57
+ ? prop.name.text
58
+ : null;
59
+ if (key === null) continue;
60
+ const value = evalNode(ts, prop.initializer);
61
+ if (value !== UNRESOLVED) obj[key] = value;
62
+ }
63
+ return obj;
64
+ }
65
+
66
+ /**
67
+ * Extracts the named `export const <name> = { … }` object-literal exports from a route file in a
68
+ * single parse, returning the statically-evaluable subset of each (dynamic and computed values are
69
+ * skipped). Names that are absent or not object literals are omitted from the result.
70
+ */
71
+ export function extractStaticExports(
72
+ ts: Ts,
73
+ filePath: string,
74
+ names: readonly string[],
75
+ ): Record<string, Record<string, unknown>> {
76
+ let source: string;
77
+ try {
78
+ source = fs.readFileSync(filePath, 'utf8');
79
+ } catch {
80
+ return {};
81
+ }
82
+ const wanted = new Set(names);
83
+ const out: Record<string, Record<string, unknown>> = {};
84
+ const sf = ts.createSourceFile(
85
+ filePath,
86
+ source,
87
+ ts.ScriptTarget.Latest,
88
+ true,
89
+ ts.ScriptKind.TSX,
90
+ );
91
+ for (const stmt of sf.statements) {
92
+ if (!ts.isVariableStatement(stmt)) continue;
93
+ if (!stmt.modifiers?.some((m) => m.kind === ts.SyntaxKind.ExportKeyword)) continue;
94
+ for (const decl of stmt.declarationList.declarations) {
95
+ if (
96
+ ts.isIdentifier(decl.name) &&
97
+ wanted.has(decl.name.text) &&
98
+ !(decl.name.text in out) &&
99
+ decl.initializer &&
100
+ ts.isObjectLiteralExpression(decl.initializer)
101
+ ) {
102
+ out[decl.name.text] = evalObject(ts, decl.initializer);
103
+ }
104
+ }
105
+ }
106
+ return out;
107
+ }
108
+
109
+ /**
110
+ * Extracts a route's `export const metadata = { … }` if it's a static object literal, returning the
111
+ * statically-evaluable subset (dynamic `generateMetadata` and computed values are skipped). `null`
112
+ * when the file has no static metadata.
113
+ */
114
+ export function extractStaticMetadata(ts: Ts, filePath: string): Record<string, unknown> | null {
115
+ return extractStaticExports(ts, filePath, ['metadata']).metadata ?? null;
116
+ }
117
+
118
+ /**
119
+ * Build-only plugin that statically pre-renders per-route HTML for SEO. After the bundle is written,
120
+ * it takes the built shell (`index.html`), and for each static route bakes that route's
121
+ * `metadata` (merged over the site-wide `seo` defaults) into a `<route>/index.html` so a JS-less
122
+ * crawler hitting the route gets correct per-page tags. Dynamic (`generateMetadata`) and `:param`
123
+ * routes are skipped (no data at build) and fall back to the client-rendered shell.
124
+ */
125
+ export function prerenderPlugin(cfg: ResolvedToilConfig): Plugin {
126
+ return {
127
+ name: 'toil:prerender-seo',
128
+ apply: 'build',
129
+ async closeBundle() {
130
+ if (!cfg.seo) return;
131
+ const outDir = path.resolve(cfg.root, cfg.outDir);
132
+ const shellPath = path.join(outDir, 'index.html');
133
+ if (!fs.existsSync(shellPath)) return;
134
+ const shell = fs.readFileSync(shellPath, 'utf8');
135
+ // Stash the clean built shell (asset tags, no per-route SEO yet) so the post-build SSG
136
+ // pass bakes dynamic routes from it rather than from this file once it's been overwritten
137
+ // with the `/` route's head (which would duplicate canonical/og tags).
138
+ fs.writeFileSync(path.join(cfg.toilDir, 'shell.html'), shell);
139
+ const ts = await loadTypeScript(cfg.root);
140
+
141
+ const routes = scanRoutes(cfg.routesAbsDir).filter(
142
+ (r) => r.slot === undefined && !r.intercept && !/[:*]/.test(r.pattern),
143
+ );
144
+ for (const route of routes) {
145
+ const metadata = ts ? extractStaticMetadata(ts, route.file) : null;
146
+ const html = injectSeoHtml(shell, routeSeo(cfg.seo, metadata, route.pattern));
147
+ const target =
148
+ route.pattern === '/'
149
+ ? shellPath
150
+ : path.join(outDir, route.pattern.replace(/^\//, ''), 'index.html');
151
+ fs.mkdirSync(path.dirname(target), { recursive: true });
152
+ fs.writeFileSync(target, html);
153
+ }
154
+ },
155
+ };
156
+ }