Inline initial script

This commit is contained in:
Jake Archibald
2020-11-12 13:59:50 +00:00
parent f1da577ba3
commit d1ee92e884
3 changed files with 20 additions and 5 deletions

View File

@@ -15,6 +15,7 @@ import rollup from 'rollup';
const prefix = 'client-bundle:';
const entryPathPlaceholder = 'CLIENT_BUNDLE_PLUGIN_ENTRY_PATH';
const importsPlaceholder = 'CLIENT_BUNDLE_PLUGIN_IMPORTS';
const allSrcPlaceholder = 'CLIENT_BUNDLE_PLUGIN_ALL_SRC';
export function getDependencies(clientOutput, item) {
const crawlDependencies = new Set([item.fileName]);
@@ -70,6 +71,9 @@ export default function (inputOptions, outputOptions, resolveFileUrl) {
`export const imports = import.meta.${
importsPlaceholder + exportCounter
};`,
`export const allSrc = import.meta.${
allSrcPlaceholder + exportCounter
};`,
].join('\n');
},
async buildEnd(error) {
@@ -108,6 +112,8 @@ export default function (inputOptions, outputOptions, resolveFileUrl) {
num = Number(property.slice(entryPathPlaceholder.length));
} else if (property.startsWith(importsPlaceholder)) {
num = Number(property.slice(importsPlaceholder.length));
} else if (property.startsWith(allSrcPlaceholder)) {
num = Number(property.slice(allSrcPlaceholder.length));
} else {
// This isn't one of our placeholders.
return;
@@ -128,6 +134,12 @@ export default function (inputOptions, outputOptions, resolveFileUrl) {
const dependencies = getDependencies(clientOutput, clientEntry);
if (property.startsWith(allSrcPlaceholder)) {
return JSON.stringify(
[clientEntry.code, ...dependencies.map((d) => d.code)].join(';'),
);
}
return (
'[' +
dependencies

View File

@@ -17,6 +17,8 @@ declare module 'client-bundle:*' {
const url: string;
export default url;
export const imports: string[];
/** Source for this script and all its dependencies */
export const allSrc: string;
}
declare module 'initial-css:' {

View File

@@ -14,7 +14,7 @@ import { h, FunctionalComponent } from 'preact';
import baseCss from 'css:./base.css';
import initialCss from 'initial-css:';
import clientBundleURL, { imports } from 'client-bundle:client/initial-app';
import { allSrc } from 'client-bundle:client/initial-app';
import favicon from 'url:static-build/assets/favicon.ico';
import { escapeStyleScriptContent } from 'static-build/utils';
import Intro from 'shared/initial-app/Intro';
@@ -46,15 +46,16 @@ const Index: FunctionalComponent<Props> = () => (
__html: escapeStyleScriptContent(initialCss),
}}
/>
<script src={clientBundleURL} defer />
{imports.map((v) => (
<link rel="preload" as="script" href={v} />
))}
</head>
<body>
<div id="app">
<Intro />
</div>
<script
dangerouslySetInnerHTML={{
__html: escapeStyleScriptContent(allSrc),
}}
/>
</body>
</html>
);