mirror of
https://github.com/dillonkearns/elm-pages-v3-beta.git
synced 2024-12-27 05:44:17 +03:00
Allow for user-customized head tags template that is processed by Vite.
This commit is contained in:
Dillon Kearns
parent
82afc3a493
commit
0f8cd29c14
@ -9,4 +9,17 @@ export default {
|
||||
]),
|
||||
],
|
||||
}),
|
||||
headTagsTemplate: (context) => `
|
||||
<link rel="stylesheet" href="/style.css" />
|
||||
<meta charset="UTF-8" />
|
||||
<meta name="viewport" content="width=device-width,initial-scale=1" />
|
||||
<meta name="generator" content="elm-pages v${context.cliVersion}" />
|
||||
<meta name="mobile-web-app-capable" content="yes" />
|
||||
<meta name="theme-color" content="#abc123" />
|
||||
<meta name="apple-mobile-web-app-capable" content="yes" />
|
||||
<meta
|
||||
name="apple-mobile-web-app-status-bar-style"
|
||||
content="black-translucent"
|
||||
/>
|
||||
`,
|
||||
};
|
||||
|
||||
6
examples/end-to-end/package-lock.json
generated
6
examples/end-to-end/package-lock.json
generated
@ -16,7 +16,7 @@
|
||||
},
|
||||
"../..": {
|
||||
"name": "elm-pages",
|
||||
"version": "3.0.0-beta.5",
|
||||
"version": "3.0.0-beta.6",
|
||||
"dev": true,
|
||||
"license": "BSD-3-Clause",
|
||||
"dependencies": {
|
||||
@ -41,7 +41,7 @@
|
||||
"object-hash": "^2.2.0",
|
||||
"serve-static": "^1.15.0",
|
||||
"terser": "^5.14.2",
|
||||
"vite": "^3.0.9",
|
||||
"vite": "^3.1.8",
|
||||
"which": "^2.0.2"
|
||||
},
|
||||
"bin": {
|
||||
@ -1518,7 +1518,7 @@
|
||||
"serve-static": "^1.15.0",
|
||||
"terser": "^5.14.2",
|
||||
"typescript": "^4.7.4",
|
||||
"vite": "^3.0.9",
|
||||
"vite": "^3.1.8",
|
||||
"which": "^2.0.2"
|
||||
},
|
||||
"dependencies": {
|
||||
|
||||
@ -76,16 +76,28 @@ async function run(options) {
|
||||
const generateCode = codegen.generate(options.base);
|
||||
|
||||
await generateCode;
|
||||
await fsPromises.writeFile(
|
||||
"elm-stuff/elm-pages/index.html",
|
||||
preRenderHtml.templateHtml()
|
||||
);
|
||||
|
||||
const config = await import(
|
||||
path.join(process.cwd(), "elm-pages.config.mjs")
|
||||
)
|
||||
.then(async (elmPagesConfig) => {
|
||||
return elmPagesConfig.default || {};
|
||||
return (
|
||||
elmPagesConfig.default || {
|
||||
headTagsTemplate: (context) => `
|
||||
<link rel="stylesheet" href="/style.css" />
|
||||
<meta charset="UTF-8" />
|
||||
<meta name="viewport" content="width=device-width,initial-scale=1" />
|
||||
<meta name="generator" content="elm-pages v${context.cliVersion}" />
|
||||
<meta name="mobile-web-app-capable" content="yes" />
|
||||
<meta name="theme-color" content="#ffffff" />
|
||||
<meta name="apple-mobile-web-app-capable" content="yes" />
|
||||
<meta
|
||||
name="apple-mobile-web-app-status-bar-style"
|
||||
content="black-translucent"
|
||||
/>
|
||||
`,
|
||||
}
|
||||
);
|
||||
})
|
||||
.catch((error) => {
|
||||
console.warn(
|
||||
@ -93,6 +105,11 @@ async function run(options) {
|
||||
);
|
||||
return {};
|
||||
});
|
||||
|
||||
await fsPromises.writeFile(
|
||||
"elm-stuff/elm-pages/index.html",
|
||||
preRenderHtml.templateHtml(false, config.headTagsTemplate)
|
||||
);
|
||||
const viteConfig = merge_vite_configs(
|
||||
{
|
||||
configFile: false,
|
||||
|
||||
@ -25,6 +25,7 @@ const { createServer: createViteServer } = require("vite");
|
||||
const cliVersion = require("../../package.json").version;
|
||||
const esbuild = require("esbuild");
|
||||
const { merge_vite_configs } = require("./vite-utils.js");
|
||||
const { templateHtml } = require("./pre-render-html.js");
|
||||
|
||||
/**
|
||||
* @param {{ port: string; base: string; https: boolean; debug: boolean; }} options
|
||||
@ -118,11 +119,26 @@ async function start(options) {
|
||||
watcher.add(sourceDirs);
|
||||
}
|
||||
|
||||
const viteConfig = await import(
|
||||
path.join(process.cwd(), "elm-pages.config.mjs")
|
||||
)
|
||||
const config = await import(path.join(process.cwd(), "elm-pages.config.mjs"))
|
||||
.then(async (elmPagesConfig) => {
|
||||
return elmPagesConfig.default.vite || {};
|
||||
return (
|
||||
elmPagesConfig.default || {
|
||||
vite: {},
|
||||
headTagsTemplate: (context) => `
|
||||
<link rel="stylesheet" href="/style.css" />
|
||||
<meta charset="UTF-8" />
|
||||
<meta name="viewport" content="width=device-width,initial-scale=1" />
|
||||
<meta name="generator" content="elm-pages v${context.cliVersion}" />
|
||||
<meta name="mobile-web-app-capable" content="yes" />
|
||||
<meta name="theme-color" content="#ffffff" />
|
||||
<meta name="apple-mobile-web-app-capable" content="yes" />
|
||||
<meta
|
||||
name="apple-mobile-web-app-status-bar-style"
|
||||
content="black-translucent"
|
||||
/>
|
||||
`,
|
||||
}
|
||||
);
|
||||
})
|
||||
.catch((error) => {
|
||||
console.warn(
|
||||
@ -145,7 +161,7 @@ async function start(options) {
|
||||
base: options.base,
|
||||
},
|
||||
|
||||
viteConfig
|
||||
config.vite
|
||||
)
|
||||
);
|
||||
esbuild
|
||||
@ -469,35 +485,7 @@ async function start(options) {
|
||||
}
|
||||
case "html": {
|
||||
try {
|
||||
const template =
|
||||
/*html*/
|
||||
`<!DOCTYPE html>
|
||||
<!-- ROOT --><html lang="en">
|
||||
<head>
|
||||
<script src="/hmr.js" type="text/javascript"></script>
|
||||
<script src="/elm.js" type="text/javascript"></script>
|
||||
<link rel="stylesheet" href="/style.css">
|
||||
<link rel="stylesheet" href="/dev-style.css">
|
||||
<script src="/elm-pages.js" type="module"></script>
|
||||
<meta charset="UTF-8" />
|
||||
<meta name="viewport" content="width=device-width,initial-scale=1" />
|
||||
<title><!-- PLACEHOLDER_TITLE --></title>
|
||||
<meta name="generator" content="elm-pages v${cliVersion}" />
|
||||
<meta name="mobile-web-app-capable" content="yes" />
|
||||
<meta name="theme-color" content="#ffffff" />
|
||||
<meta name="apple-mobile-web-app-capable" content="yes" />
|
||||
<meta
|
||||
name="apple-mobile-web-app-status-bar-style"
|
||||
content="black-translucent"
|
||||
/>
|
||||
<!-- PLACEHOLDER_HEAD_AND_DATA -->
|
||||
</head>
|
||||
<body>
|
||||
<div data-url="" display="none"></div>
|
||||
<!-- PLACEHOLDER_HTML -->
|
||||
</body>
|
||||
</html>
|
||||
`;
|
||||
const template = templateHtml(true, config.headTagsTemplate);
|
||||
const processedTemplate = await vite.transformIndexHtml(
|
||||
req.originalUrl,
|
||||
template
|
||||
|
||||
@ -17,28 +17,29 @@ function wrapHtml(basePath, fromElm, contentDatPayload) {
|
||||
};
|
||||
}
|
||||
|
||||
function templateHtml() {
|
||||
/**
|
||||
* @param {boolean} devMode
|
||||
* @param {(context: {cliVersion: string;}) => string} userHeadTagsTemplate
|
||||
*/
|
||||
function templateHtml(devMode, userHeadTagsTemplate) {
|
||||
return /* html */ `<!DOCTYPE html>
|
||||
<!-- ROOT --><html lang="en">
|
||||
<head>
|
||||
<!-- PLACEHOLDER_PRELOADS -->
|
||||
<title><!-- PLACEHOLDER_TITLE --></title>
|
||||
${
|
||||
devMode
|
||||
? `
|
||||
<script src="/hmr.js" type="text/javascript"></script>
|
||||
<link rel="stylesheet" href="/dev-style.css">`
|
||||
: `
|
||||
<!-- PLACEHOLDER_PRELOADS -->`
|
||||
}
|
||||
<script defer src="/elm.js" type="text/javascript"></script>
|
||||
<script defer src="${path.join(
|
||||
__dirname,
|
||||
"../static-code/elm-pages.js"
|
||||
)}" type="module"></script>
|
||||
<link rel="stylesheet" href="/style.css" />
|
||||
<meta charset="UTF-8" />
|
||||
<meta name="viewport" content="width=device-width,initial-scale=1" />
|
||||
<title><!-- PLACEHOLDER_TITLE --></title>
|
||||
<meta name="generator" content="elm-pages v${cliVersion}" />
|
||||
<meta name="mobile-web-app-capable" content="yes" />
|
||||
<meta name="theme-color" content="#ffffff" />
|
||||
<meta name="apple-mobile-web-app-capable" content="yes" />
|
||||
<meta
|
||||
name="apple-mobile-web-app-status-bar-style"
|
||||
content="black-translucent"
|
||||
/>
|
||||
${userHeadTagsTemplate({ cliVersion })}
|
||||
<!-- PLACEHOLDER_HEAD_AND_DATA -->
|
||||
</head>
|
||||
<body>
|
||||
|
||||
Loading…
Reference in New Issue
Block a user