veryfront 0.1.170 → 0.1.171
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/esm/deno.js +1 -1
- package/esm/src/rendering/orchestrator/html-head.d.ts +18 -0
- package/esm/src/rendering/orchestrator/html-head.d.ts.map +1 -0
- package/esm/src/rendering/orchestrator/html-head.js +63 -0
- package/esm/src/rendering/orchestrator/html.d.ts +0 -2
- package/esm/src/rendering/orchestrator/html.d.ts.map +1 -1
- package/esm/src/rendering/orchestrator/html.js +5 -69
- package/esm/src/utils/version-constant.d.ts +1 -1
- package/esm/src/utils/version-constant.js +1 -1
- package/package.json +1 -1
- package/src/deno.js +1 -1
- package/src/src/rendering/orchestrator/html-head.ts +74 -0
- package/src/src/rendering/orchestrator/html.ts +8 -72
- package/src/src/utils/version-constant.ts +1 -1
package/esm/deno.js
CHANGED
|
@@ -0,0 +1,18 @@
|
|
|
1
|
+
import type { CollectedHead } from "../../react/head-collector.js";
|
|
2
|
+
import type { MdxBundle, MDXFrontmatter } from "../../types/index.js";
|
|
3
|
+
interface FrontmatterContextLike {
|
|
4
|
+
pageInfo: {
|
|
5
|
+
entity: {
|
|
6
|
+
frontmatter?: Record<string, unknown>;
|
|
7
|
+
};
|
|
8
|
+
};
|
|
9
|
+
pageBundle: Pick<MdxBundle, "frontmatter">;
|
|
10
|
+
collectedMetadata?: Record<string, unknown>;
|
|
11
|
+
}
|
|
12
|
+
export declare function buildHeadElements(head?: CollectedHead): {
|
|
13
|
+
scripts: string;
|
|
14
|
+
other: string;
|
|
15
|
+
};
|
|
16
|
+
export declare function mergeFrontmatter(context: FrontmatterContextLike): MDXFrontmatter;
|
|
17
|
+
export {};
|
|
18
|
+
//# sourceMappingURL=html-head.d.ts.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"html-head.d.ts","sourceRoot":"","sources":["../../../../src/src/rendering/orchestrator/html-head.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,aAAa,EAAE,MAAM,+BAA+B,CAAC;AACnE,OAAO,KAAK,EAAE,SAAS,EAAE,cAAc,EAAE,MAAM,sBAAsB,CAAC;AAEtE,UAAU,sBAAsB;IAC9B,QAAQ,EAAE;QAAE,MAAM,EAAE;YAAE,WAAW,CAAC,EAAE,MAAM,CAAC,MAAM,EAAE,OAAO,CAAC,CAAA;SAAE,CAAA;KAAE,CAAC;IAChE,UAAU,EAAE,IAAI,CAAC,SAAS,EAAE,aAAa,CAAC,CAAC;IAC3C,iBAAiB,CAAC,EAAE,MAAM,CAAC,MAAM,EAAE,OAAO,CAAC,CAAC;CAC7C;AAED,wBAAgB,iBAAiB,CAAC,IAAI,CAAC,EAAE,aAAa,GAAG;IAAE,OAAO,EAAE,MAAM,CAAC;IAAC,KAAK,EAAE,MAAM,CAAA;CAAE,CAwD1F;AAED,wBAAgB,gBAAgB,CAAC,OAAO,EAAE,sBAAsB,GAAG,cAAc,CAMhF"}
|
|
@@ -0,0 +1,63 @@
|
|
|
1
|
+
export function buildHeadElements(head) {
|
|
2
|
+
if (!head)
|
|
3
|
+
return { scripts: "", other: "" };
|
|
4
|
+
const scriptParts = [];
|
|
5
|
+
const otherParts = [];
|
|
6
|
+
for (const script of head.scripts ?? []) {
|
|
7
|
+
const { content, ...attrs } = script;
|
|
8
|
+
const attrPairs = [["data-vf-head", "true"]];
|
|
9
|
+
for (const [k, v] of Object.entries(attrs)) {
|
|
10
|
+
if (v != null)
|
|
11
|
+
attrPairs.push([k, v]);
|
|
12
|
+
}
|
|
13
|
+
if (content && !attrs.id) {
|
|
14
|
+
let sum = 0;
|
|
15
|
+
for (let i = 0; i < Math.min(content.length, 200); i++) {
|
|
16
|
+
sum = ((sum << 5) - sum + content.charCodeAt(i)) | 0;
|
|
17
|
+
}
|
|
18
|
+
attrPairs.push(["data-vf-hash", "vf" + Math.abs(sum).toString(36)]);
|
|
19
|
+
}
|
|
20
|
+
const attrStr = attrPairs.map(([k, v]) => `${k}="${v}"`).join(" ");
|
|
21
|
+
if (content) {
|
|
22
|
+
scriptParts.push(`<script ${attrStr}>${content}</script>`);
|
|
23
|
+
}
|
|
24
|
+
else if (attrs.src) {
|
|
25
|
+
scriptParts.push(`<script ${attrStr}></script>`);
|
|
26
|
+
}
|
|
27
|
+
}
|
|
28
|
+
for (const meta of head.metas) {
|
|
29
|
+
if (meta.name === "description")
|
|
30
|
+
continue;
|
|
31
|
+
const attrs = [];
|
|
32
|
+
if (meta.name)
|
|
33
|
+
attrs.push(`name="${meta.name}"`);
|
|
34
|
+
if (meta.property)
|
|
35
|
+
attrs.push(`property="${meta.property}"`);
|
|
36
|
+
if (meta.content)
|
|
37
|
+
attrs.push(`content="${meta.content}"`);
|
|
38
|
+
if (attrs.length)
|
|
39
|
+
otherParts.push(`<meta ${attrs.join(" ")}>`);
|
|
40
|
+
}
|
|
41
|
+
for (const link of head.links) {
|
|
42
|
+
const attrs = Object.entries(link)
|
|
43
|
+
.filter(([, v]) => v != null)
|
|
44
|
+
.map(([k, v]) => `${k}="${v}"`)
|
|
45
|
+
.join(" ");
|
|
46
|
+
if (attrs)
|
|
47
|
+
otherParts.push(`<link ${attrs}>`);
|
|
48
|
+
}
|
|
49
|
+
for (const style of head.styles) {
|
|
50
|
+
otherParts.push(`<style>${style}</style>`);
|
|
51
|
+
}
|
|
52
|
+
return {
|
|
53
|
+
scripts: scriptParts.join("\n "),
|
|
54
|
+
other: otherParts.join("\n "),
|
|
55
|
+
};
|
|
56
|
+
}
|
|
57
|
+
export function mergeFrontmatter(context) {
|
|
58
|
+
return {
|
|
59
|
+
...context.pageInfo.entity.frontmatter,
|
|
60
|
+
...context.pageBundle.frontmatter,
|
|
61
|
+
...(context.collectedMetadata ?? {}),
|
|
62
|
+
};
|
|
63
|
+
}
|
|
@@ -33,8 +33,6 @@ export declare class HTMLGenerator {
|
|
|
33
33
|
private detectUseClientDirective;
|
|
34
34
|
private wrapHTMLFragment;
|
|
35
35
|
private generateShellParts;
|
|
36
|
-
private buildHeadElements;
|
|
37
|
-
private mergeFrontmatter;
|
|
38
36
|
private resolveAppPath;
|
|
39
37
|
private loadProjectFile;
|
|
40
38
|
private buildHTMLOptions;
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"html.d.ts","sourceRoot":"","sources":["../../../../src/src/rendering/orchestrator/html.ts"],"names":[],"mappings":"AAEA,OAAO,KAAK,EAAE,eAAe,EAAE,MAAM,uBAAuB,CAAC;AAS7D,OAAO,KAAK,EAAE,aAAa,EAAE,MAAM,+BAA+B,CAAC;AACnE,OAAO,KAAK,EAAE,cAAc,EAAE,MAAM,iCAAiC,CAAC;AACtE,OAAO,KAAK,EACV,UAAU,EACV,UAAU,EACV,SAAS,EAET,UAAU,EACX,MAAM,sBAAsB,CAAC;AAG9B,OAAO,KAAK,EAAE,aAAa,EAAE,MAAM,YAAY,CAAC;
|
|
1
|
+
{"version":3,"file":"html.d.ts","sourceRoot":"","sources":["../../../../src/src/rendering/orchestrator/html.ts"],"names":[],"mappings":"AAEA,OAAO,KAAK,EAAE,eAAe,EAAE,MAAM,uBAAuB,CAAC;AAS7D,OAAO,KAAK,EAAE,aAAa,EAAE,MAAM,+BAA+B,CAAC;AACnE,OAAO,KAAK,EAAE,cAAc,EAAE,MAAM,iCAAiC,CAAC;AACtE,OAAO,KAAK,EACV,UAAU,EACV,UAAU,EACV,SAAS,EAET,UAAU,EACX,MAAM,sBAAsB,CAAC;AAG9B,OAAO,KAAK,EAAE,aAAa,EAAE,MAAM,YAAY,CAAC;AAgFhD,MAAM,WAAW,mBAAmB;IAClC,UAAU,EAAE,MAAM,CAAC;IACnB,OAAO,EAAE,cAAc,CAAC;IACxB,MAAM,EAAE,eAAe,CAAC;IACxB,IAAI,EAAE,aAAa,GAAG,YAAY,CAAC;CACpC;AAED,MAAM,WAAW,qBAAqB;IACpC,IAAI,EAAE,MAAM,CAAC;IACb,QAAQ,EAAE,UAAU,CAAC;IACrB,UAAU,EAAE,UAAU,CAAC;IACvB,YAAY,EAAE,SAAS,GAAG,SAAS,CAAC;IACpC,aAAa,EAAE,UAAU,EAAE,CAAC;IAC5B,iBAAiB,EAAE,MAAM,CAAC,MAAM,EAAE,OAAO,CAAC,CAAC;IAC3C,IAAI,EAAE,MAAM,CAAC;IACb,OAAO,EAAE,MAAM,CAAC;IAChB,OAAO,CAAC,EAAE,aAAa,CAAC;IACxB,aAAa,CAAC,EAAE,aAAa,CAAC;IAC9B,2FAA2F;IAC3F,UAAU,CAAC,EAAE,MAAM,EAAE,CAAC;CACvB;AAED,qBAAa,aAAa;IACxB,OAAO,CAAC,MAAM,CAAsB;gBAExB,MAAM,EAAE,mBAAmB;IAIjC,gBAAgB,CAAC,OAAO,EAAE,qBAAqB,GAAG,OAAO,CAAC,MAAM,CAAC;IA0BjE,kBAAkB,CACtB,WAAW,EAAE,cAAc,EAC3B,OAAO,EAAE,IAAI,CAAC,qBAAqB,EAAE,MAAM,CAAC,GAC3C,OAAO,CAAC,cAAc,CAAC;YAqEZ,sBAAsB;YAqDtB,4BAA4B;YAiB5B,wBAAwB;YAmBxB,gBAAgB;YAyBhB,kBAAkB;IAwDhC,OAAO,CAAC,cAAc;YAQR,eAAe;YAaf,gBAAgB;IAgF9B;;;;OAIG;YACW,gBAAgB;CA0D/B"}
|
|
@@ -11,6 +11,7 @@ import { StreamTimeoutError, streamToString } from "../utils/stream-utils.js";
|
|
|
11
11
|
import { profilePhase, profileSyncPhase } from "../../observability/request-profiler.js";
|
|
12
12
|
import { normalizeCssModuleKey, rewriteCssModuleContent, } from "../../transforms/css-modules/naming.js";
|
|
13
13
|
import { extractProjectClassesForRoute, startPreparedCSSWarmup, startProjectCSSPreparation, } from "./html-project-css.js";
|
|
14
|
+
import { buildHeadElements as buildCollectedHeadElements, mergeFrontmatter as mergeCollectedFrontmatter, } from "./html-head.js";
|
|
14
15
|
const logger = rendererLogger.component("html-generator");
|
|
15
16
|
function applyExplicitThemeToDocument(html, colorScheme, enabled) {
|
|
16
17
|
if (!enabled || !colorScheme)
|
|
@@ -61,7 +62,7 @@ export class HTMLGenerator {
|
|
|
61
62
|
if (isFullHTMLDocument(context.html)) {
|
|
62
63
|
let projectCSSPromise;
|
|
63
64
|
if (this.config.mode === "production" && context.options?.environment === "production") {
|
|
64
|
-
const mergedFrontmatter =
|
|
65
|
+
const mergedFrontmatter = mergeCollectedFrontmatter(context);
|
|
65
66
|
const htmlOptions = await profilePhase("html.build_options", () => this.buildHTMLOptions(context, mergedFrontmatter));
|
|
66
67
|
projectCSSPromise = startProjectCSSPreparation(context, htmlOptions);
|
|
67
68
|
}
|
|
@@ -78,7 +79,7 @@ export class HTMLGenerator {
|
|
|
78
79
|
}
|
|
79
80
|
async generateHTMLStream(reactStream, context) {
|
|
80
81
|
const fullContext = context;
|
|
81
|
-
const mergedFrontmatter =
|
|
82
|
+
const mergedFrontmatter = mergeCollectedFrontmatter(fullContext);
|
|
82
83
|
const htmlOptions = await profilePhase("html.build_options", () => this.buildHTMLOptions(fullContext, mergedFrontmatter));
|
|
83
84
|
const projectCSSPromise = startProjectCSSPreparation(fullContext, htmlOptions);
|
|
84
85
|
startPreparedCSSWarmup(this.config, fullContext, htmlOptions);
|
|
@@ -175,7 +176,7 @@ export class HTMLGenerator {
|
|
|
175
176
|
}
|
|
176
177
|
}
|
|
177
178
|
async wrapHTMLFragment(context) {
|
|
178
|
-
const mergedFrontmatter =
|
|
179
|
+
const mergedFrontmatter = mergeCollectedFrontmatter(context);
|
|
179
180
|
const htmlOptions = await profilePhase("html.build_options", () => this.buildHTMLOptions(context, mergedFrontmatter));
|
|
180
181
|
const projectCSSPromise = startProjectCSSPreparation(context, htmlOptions);
|
|
181
182
|
startPreparedCSSWarmup(this.config, context, htmlOptions);
|
|
@@ -200,7 +201,7 @@ export class HTMLGenerator {
|
|
|
200
201
|
layoutFrontmatter: context.layoutBundle?.frontmatter,
|
|
201
202
|
ssrHash: context.ssrHash,
|
|
202
203
|
}, htmlOptions, context.options?.params, context.options?.props, reactContent, projectCSSPromise);
|
|
203
|
-
const { scripts, other } =
|
|
204
|
+
const { scripts, other } = buildCollectedHeadElements(head);
|
|
204
205
|
if (!scripts && !other)
|
|
205
206
|
return { start, end };
|
|
206
207
|
let modifiedStart = start;
|
|
@@ -220,71 +221,6 @@ export class HTMLGenerator {
|
|
|
220
221
|
}
|
|
221
222
|
return { start: modifiedStart, end };
|
|
222
223
|
}
|
|
223
|
-
buildHeadElements(head) {
|
|
224
|
-
if (!head)
|
|
225
|
-
return { scripts: "", other: "" };
|
|
226
|
-
const scriptParts = [];
|
|
227
|
-
const otherParts = [];
|
|
228
|
-
// Scripts go at TOP of head (before CSS) to prevent flash
|
|
229
|
-
for (const script of head.scripts ?? []) {
|
|
230
|
-
const { content, ...attrs } = script;
|
|
231
|
-
const attrPairs = [["data-vf-head", "true"]];
|
|
232
|
-
for (const [k, v] of Object.entries(attrs)) {
|
|
233
|
-
if (v != null)
|
|
234
|
-
attrPairs.push([k, v]);
|
|
235
|
-
}
|
|
236
|
-
// For inline scripts without id, add hash for client-side deduplication
|
|
237
|
-
if (content && !attrs.id) {
|
|
238
|
-
let sum = 0;
|
|
239
|
-
for (let i = 0; i < Math.min(content.length, 200); i++) {
|
|
240
|
-
sum = ((sum << 5) - sum + content.charCodeAt(i)) | 0;
|
|
241
|
-
}
|
|
242
|
-
attrPairs.push(["data-vf-hash", "vf" + Math.abs(sum).toString(36)]);
|
|
243
|
-
}
|
|
244
|
-
const attrStr = attrPairs.map(([k, v]) => `${k}="${v}"`).join(" ");
|
|
245
|
-
if (content) {
|
|
246
|
-
scriptParts.push(`<script ${attrStr}>${content}</script>`);
|
|
247
|
-
}
|
|
248
|
-
else if (attrs.src) {
|
|
249
|
-
scriptParts.push(`<script ${attrStr}></script>`);
|
|
250
|
-
}
|
|
251
|
-
}
|
|
252
|
-
for (const meta of head.metas) {
|
|
253
|
-
if (meta.name === "description")
|
|
254
|
-
continue;
|
|
255
|
-
const attrs = [];
|
|
256
|
-
if (meta.name)
|
|
257
|
-
attrs.push(`name="${meta.name}"`);
|
|
258
|
-
if (meta.property)
|
|
259
|
-
attrs.push(`property="${meta.property}"`);
|
|
260
|
-
if (meta.content)
|
|
261
|
-
attrs.push(`content="${meta.content}"`);
|
|
262
|
-
if (attrs.length)
|
|
263
|
-
otherParts.push(`<meta ${attrs.join(" ")}>`);
|
|
264
|
-
}
|
|
265
|
-
for (const link of head.links) {
|
|
266
|
-
const attrs = Object.entries(link)
|
|
267
|
-
.filter(([, v]) => v != null)
|
|
268
|
-
.map(([k, v]) => `${k}="${v}"`)
|
|
269
|
-
.join(" ");
|
|
270
|
-
if (attrs)
|
|
271
|
-
otherParts.push(`<link ${attrs}>`);
|
|
272
|
-
}
|
|
273
|
-
for (const style of head.styles) {
|
|
274
|
-
otherParts.push(`<style>${style}</style>`);
|
|
275
|
-
}
|
|
276
|
-
return {
|
|
277
|
-
scripts: scriptParts.join("\n "),
|
|
278
|
-
other: otherParts.join("\n "),
|
|
279
|
-
};
|
|
280
|
-
}
|
|
281
|
-
mergeFrontmatter(context) {
|
|
282
|
-
return {
|
|
283
|
-
...context.pageInfo.entity.frontmatter,
|
|
284
|
-
...context.pageBundle.frontmatter,
|
|
285
|
-
...(context.collectedMetadata || {}),
|
|
286
|
-
};
|
|
287
|
-
}
|
|
288
224
|
resolveAppPath() {
|
|
289
225
|
return resolveAppComponentPath(this.config.projectDir, this.config.adapter, this.config.config);
|
|
290
226
|
}
|
|
@@ -1,2 +1,2 @@
|
|
|
1
|
-
export declare const VERSION = "0.1.
|
|
1
|
+
export declare const VERSION = "0.1.171";
|
|
2
2
|
//# sourceMappingURL=version-constant.d.ts.map
|
package/package.json
CHANGED
package/src/deno.js
CHANGED
|
@@ -0,0 +1,74 @@
|
|
|
1
|
+
import type { CollectedHead } from "../../react/head-collector.js";
|
|
2
|
+
import type { MdxBundle, MDXFrontmatter } from "../../types/index.js";
|
|
3
|
+
|
|
4
|
+
interface FrontmatterContextLike {
|
|
5
|
+
pageInfo: { entity: { frontmatter?: Record<string, unknown> } };
|
|
6
|
+
pageBundle: Pick<MdxBundle, "frontmatter">;
|
|
7
|
+
collectedMetadata?: Record<string, unknown>;
|
|
8
|
+
}
|
|
9
|
+
|
|
10
|
+
export function buildHeadElements(head?: CollectedHead): { scripts: string; other: string } {
|
|
11
|
+
if (!head) return { scripts: "", other: "" };
|
|
12
|
+
|
|
13
|
+
const scriptParts: string[] = [];
|
|
14
|
+
const otherParts: string[] = [];
|
|
15
|
+
|
|
16
|
+
for (const script of head.scripts ?? []) {
|
|
17
|
+
const { content, ...attrs } = script;
|
|
18
|
+
const attrPairs: [string, string][] = [["data-vf-head", "true"]];
|
|
19
|
+
|
|
20
|
+
for (const [k, v] of Object.entries(attrs)) {
|
|
21
|
+
if (v != null) attrPairs.push([k, v]);
|
|
22
|
+
}
|
|
23
|
+
|
|
24
|
+
if (content && !attrs.id) {
|
|
25
|
+
let sum = 0;
|
|
26
|
+
for (let i = 0; i < Math.min(content.length, 200); i++) {
|
|
27
|
+
sum = ((sum << 5) - sum + content.charCodeAt(i)) | 0;
|
|
28
|
+
}
|
|
29
|
+
attrPairs.push(["data-vf-hash", "vf" + Math.abs(sum).toString(36)]);
|
|
30
|
+
}
|
|
31
|
+
|
|
32
|
+
const attrStr = attrPairs.map(([k, v]) => `${k}="${v}"`).join(" ");
|
|
33
|
+
if (content) {
|
|
34
|
+
scriptParts.push(`<script ${attrStr}>${content}</script>`);
|
|
35
|
+
} else if (attrs.src) {
|
|
36
|
+
scriptParts.push(`<script ${attrStr}></script>`);
|
|
37
|
+
}
|
|
38
|
+
}
|
|
39
|
+
|
|
40
|
+
for (const meta of head.metas) {
|
|
41
|
+
if (meta.name === "description") continue;
|
|
42
|
+
|
|
43
|
+
const attrs: string[] = [];
|
|
44
|
+
if (meta.name) attrs.push(`name="${meta.name}"`);
|
|
45
|
+
if (meta.property) attrs.push(`property="${meta.property}"`);
|
|
46
|
+
if (meta.content) attrs.push(`content="${meta.content}"`);
|
|
47
|
+
if (attrs.length) otherParts.push(`<meta ${attrs.join(" ")}>`);
|
|
48
|
+
}
|
|
49
|
+
|
|
50
|
+
for (const link of head.links) {
|
|
51
|
+
const attrs = Object.entries(link)
|
|
52
|
+
.filter(([, v]) => v != null)
|
|
53
|
+
.map(([k, v]) => `${k}="${v}"`)
|
|
54
|
+
.join(" ");
|
|
55
|
+
if (attrs) otherParts.push(`<link ${attrs}>`);
|
|
56
|
+
}
|
|
57
|
+
|
|
58
|
+
for (const style of head.styles) {
|
|
59
|
+
otherParts.push(`<style>${style}</style>`);
|
|
60
|
+
}
|
|
61
|
+
|
|
62
|
+
return {
|
|
63
|
+
scripts: scriptParts.join("\n "),
|
|
64
|
+
other: otherParts.join("\n "),
|
|
65
|
+
};
|
|
66
|
+
}
|
|
67
|
+
|
|
68
|
+
export function mergeFrontmatter(context: FrontmatterContextLike): MDXFrontmatter {
|
|
69
|
+
return {
|
|
70
|
+
...context.pageInfo.entity.frontmatter,
|
|
71
|
+
...context.pageBundle.frontmatter,
|
|
72
|
+
...(context.collectedMetadata ?? {}),
|
|
73
|
+
} as MDXFrontmatter;
|
|
74
|
+
}
|
|
@@ -37,6 +37,10 @@ import {
|
|
|
37
37
|
startPreparedCSSWarmup,
|
|
38
38
|
startProjectCSSPreparation,
|
|
39
39
|
} from "./html-project-css.js";
|
|
40
|
+
import {
|
|
41
|
+
buildHeadElements as buildCollectedHeadElements,
|
|
42
|
+
mergeFrontmatter as mergeCollectedFrontmatter,
|
|
43
|
+
} from "./html-head.js";
|
|
40
44
|
|
|
41
45
|
const logger = rendererLogger.component("html-generator");
|
|
42
46
|
|
|
@@ -130,7 +134,7 @@ export class HTMLGenerator {
|
|
|
130
134
|
if (isFullHTMLDocument(context.html)) {
|
|
131
135
|
let projectCSSPromise: Promise<ProjectCSSResult> | undefined;
|
|
132
136
|
if (this.config.mode === "production" && context.options?.environment === "production") {
|
|
133
|
-
const mergedFrontmatter =
|
|
137
|
+
const mergedFrontmatter = mergeCollectedFrontmatter(context);
|
|
134
138
|
const htmlOptions = await profilePhase(
|
|
135
139
|
"html.build_options",
|
|
136
140
|
() => this.buildHTMLOptions(context, mergedFrontmatter),
|
|
@@ -156,7 +160,7 @@ export class HTMLGenerator {
|
|
|
156
160
|
context: Omit<HTMLGenerationContext, "html">,
|
|
157
161
|
): Promise<ReadableStream> {
|
|
158
162
|
const fullContext = context as HTMLGenerationContext;
|
|
159
|
-
const mergedFrontmatter =
|
|
163
|
+
const mergedFrontmatter = mergeCollectedFrontmatter(fullContext);
|
|
160
164
|
const htmlOptions = await profilePhase(
|
|
161
165
|
"html.build_options",
|
|
162
166
|
() => this.buildHTMLOptions(fullContext, mergedFrontmatter),
|
|
@@ -313,7 +317,7 @@ export class HTMLGenerator {
|
|
|
313
317
|
}
|
|
314
318
|
|
|
315
319
|
private async wrapHTMLFragment(context: HTMLGenerationContext): Promise<string> {
|
|
316
|
-
const mergedFrontmatter =
|
|
320
|
+
const mergedFrontmatter = mergeCollectedFrontmatter(context);
|
|
317
321
|
const htmlOptions = await profilePhase(
|
|
318
322
|
"html.build_options",
|
|
319
323
|
() => this.buildHTMLOptions(context, mergedFrontmatter),
|
|
@@ -369,7 +373,7 @@ export class HTMLGenerator {
|
|
|
369
373
|
projectCSSPromise,
|
|
370
374
|
);
|
|
371
375
|
|
|
372
|
-
const { scripts, other } =
|
|
376
|
+
const { scripts, other } = buildCollectedHeadElements(head);
|
|
373
377
|
if (!scripts && !other) return { start, end };
|
|
374
378
|
|
|
375
379
|
let modifiedStart = start;
|
|
@@ -393,74 +397,6 @@ export class HTMLGenerator {
|
|
|
393
397
|
return { start: modifiedStart, end };
|
|
394
398
|
}
|
|
395
399
|
|
|
396
|
-
private buildHeadElements(head?: CollectedHead): { scripts: string; other: string } {
|
|
397
|
-
if (!head) return { scripts: "", other: "" };
|
|
398
|
-
|
|
399
|
-
const scriptParts: string[] = [];
|
|
400
|
-
const otherParts: string[] = [];
|
|
401
|
-
|
|
402
|
-
// Scripts go at TOP of head (before CSS) to prevent flash
|
|
403
|
-
for (const script of head.scripts ?? []) {
|
|
404
|
-
const { content, ...attrs } = script;
|
|
405
|
-
const attrPairs: [string, string][] = [["data-vf-head", "true"]];
|
|
406
|
-
|
|
407
|
-
for (const [k, v] of Object.entries(attrs)) {
|
|
408
|
-
if (v != null) attrPairs.push([k, v]);
|
|
409
|
-
}
|
|
410
|
-
|
|
411
|
-
// For inline scripts without id, add hash for client-side deduplication
|
|
412
|
-
if (content && !attrs.id) {
|
|
413
|
-
let sum = 0;
|
|
414
|
-
for (let i = 0; i < Math.min(content.length, 200); i++) {
|
|
415
|
-
sum = ((sum << 5) - sum + content.charCodeAt(i)) | 0;
|
|
416
|
-
}
|
|
417
|
-
attrPairs.push(["data-vf-hash", "vf" + Math.abs(sum).toString(36)]);
|
|
418
|
-
}
|
|
419
|
-
|
|
420
|
-
const attrStr = attrPairs.map(([k, v]) => `${k}="${v}"`).join(" ");
|
|
421
|
-
if (content) {
|
|
422
|
-
scriptParts.push(`<script ${attrStr}>${content}</script>`);
|
|
423
|
-
} else if (attrs.src) {
|
|
424
|
-
scriptParts.push(`<script ${attrStr}></script>`);
|
|
425
|
-
}
|
|
426
|
-
}
|
|
427
|
-
|
|
428
|
-
for (const meta of head.metas) {
|
|
429
|
-
if (meta.name === "description") continue;
|
|
430
|
-
|
|
431
|
-
const attrs: string[] = [];
|
|
432
|
-
if (meta.name) attrs.push(`name="${meta.name}"`);
|
|
433
|
-
if (meta.property) attrs.push(`property="${meta.property}"`);
|
|
434
|
-
if (meta.content) attrs.push(`content="${meta.content}"`);
|
|
435
|
-
if (attrs.length) otherParts.push(`<meta ${attrs.join(" ")}>`);
|
|
436
|
-
}
|
|
437
|
-
|
|
438
|
-
for (const link of head.links) {
|
|
439
|
-
const attrs = Object.entries(link)
|
|
440
|
-
.filter(([, v]) => v != null)
|
|
441
|
-
.map(([k, v]) => `${k}="${v}"`)
|
|
442
|
-
.join(" ");
|
|
443
|
-
if (attrs) otherParts.push(`<link ${attrs}>`);
|
|
444
|
-
}
|
|
445
|
-
|
|
446
|
-
for (const style of head.styles) {
|
|
447
|
-
otherParts.push(`<style>${style}</style>`);
|
|
448
|
-
}
|
|
449
|
-
|
|
450
|
-
return {
|
|
451
|
-
scripts: scriptParts.join("\n "),
|
|
452
|
-
other: otherParts.join("\n "),
|
|
453
|
-
};
|
|
454
|
-
}
|
|
455
|
-
|
|
456
|
-
private mergeFrontmatter(context: HTMLGenerationContext): MDXFrontmatter {
|
|
457
|
-
return {
|
|
458
|
-
...context.pageInfo.entity.frontmatter,
|
|
459
|
-
...(context.pageBundle as MdxBundle).frontmatter,
|
|
460
|
-
...(context.collectedMetadata || {}),
|
|
461
|
-
} as MDXFrontmatter;
|
|
462
|
-
}
|
|
463
|
-
|
|
464
400
|
private resolveAppPath(): Promise<string | null> {
|
|
465
401
|
return resolveAppComponentPath(
|
|
466
402
|
this.config.projectDir,
|