Skip to content

Commit a89f8e5

Browse files
microbit-matt-hillsdonmicrobit-robert
microbit-matt-hillsdon
and
microbit-robert
authored
Template index.html title/meta (#402)
Co-authored-by: Robert Knight <[email protected]>
1 parent 9783436 commit a89f8e5

File tree

4 files changed

+54
-20
lines changed

4 files changed

+54
-20
lines changed

‎.eslintrc.cjs‎

Lines changed: 1 addition & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -41,5 +41,6 @@ module.exports = {
4141
checksVoidReturn: false,
4242
},
4343
],
44+
"@typescript-eslint/no-unused-vars": ["error", { argsIgnorePattern: "^_" }],
4445
},
4546
};

‎.github/workflows/build.yml‎

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -36,7 +36,7 @@ jobs:
3636
- run: npm ci
3737
env:
3838
NODE_AUTH_TOKEN: ${{ secrets.GITHUB_TOKEN }}
39-
- run: npm install --no-save @microbit-foundation/[email protected].21 @microbit-foundation/[email protected] @microbit-foundation/[email protected]
39+
- run: npm install --no-save @microbit-foundation/[email protected].22 @microbit-foundation/[email protected] @microbit-foundation/[email protected]
4040
if: github.repository_owner == 'microbit-foundation'
4141
env:
4242
NODE_AUTH_TOKEN: ${{ secrets.GITHUB_TOKEN }}

‎index.html‎

Lines changed: 8 additions & 12 deletions
Original file line numberDiff line numberDiff line change
@@ -8,24 +8,20 @@
88
<head>
99
<meta charset="utf-8" />
1010
<meta name="viewport" content="width=device-width,initial-scale=1" />
11-
<title>micro:bit CreateAI</title>
12-
<meta property="og:title" content="micro:bit CreateAI" />
11+
<title><%= appNameFull %></title>
12+
<meta property="og:title" content="<%= appNameFull %>" />
1313
<link rel="canonical" href="%VITE_FULL_URL%" />
1414
<meta property="og:url" content="%VITE_FULL_URL%" />
15+
<% if (ogDescription) { %>
16+
<meta property="og:description" content="<%= ogDescription %>" />
17+
<% } %>
1518
<meta name="twitter:card" content="summary_large_image" />
1619
<meta name="twitter:site" content="@microbit_edu" />
17-
<meta
18-
name="description"
19-
content="Create AI by training a machine learning model with your movement data, testing it to see if it works, then writing your own code to use it on a BBC micro:bit"
20-
/>
21-
<meta
22-
property="og:description"
23-
content="Create AI on your BBC micro:bit using movement and machine learning"
24-
/>
20+
<% if (metaDescription) { %>
21+
<meta name="description" content="<%= metaDescription %>" />
22+
<% } %>
2523
<meta property="og:image" content="%VITE_FULL_URL%social.jpg" />
26-
2724
<link rel="shortcut icon" href="%VITE_FULL_URL%imgs/favicon.ico" />
28-
2925
<script
3026
src="https://shared-assets.microbit.org/common/v1/common.js"
3127
async

‎vite.config.ts‎

Lines changed: 44 additions & 7 deletions
Original file line numberDiff line numberDiff line change
@@ -5,23 +5,62 @@
55
* SPDX-License-Identifier: MIT
66
*/
77
import react from "@vitejs/plugin-react";
8+
import ejs from "ejs";
89
import fs from "node:fs";
910
import path from "node:path";
10-
import { UserConfig, defineConfig, loadEnv } from "vite";
11-
import { configDefaults } from "vitest/config";
11+
import {
12+
IndexHtmlTransformContext,
13+
IndexHtmlTransformResult,
14+
Plugin,
15+
UserConfig,
16+
defineConfig,
17+
loadEnv,
18+
} from "vite";
1219
import svgr from "vite-plugin-svgr";
20+
import { configDefaults } from "vitest/config";
21+
22+
interface TemplateStrings {
23+
appNameFull: string;
24+
ogDescription: undefined | string;
25+
metaDescription: undefined | string;
26+
}
1327

1428
// Support optionally pulling in external branding if the module is installed.
1529
const theme = "@microbit-foundation/ml-trainer-microbit";
1630
const external = `node_modules/${theme}`;
1731
const internal = "src/deployment/default";
32+
const themePackageExternal = fs.existsSync(external);
33+
const themePackageAlias = themePackageExternal
34+
? theme
35+
: path.resolve(__dirname, internal);
36+
37+
const viteEjsPlugin = (data: ejs.Data): Plugin => {
38+
return {
39+
name: "ejs",
40+
transformIndexHtml: {
41+
order: "pre",
42+
handler: (
43+
html: string,
44+
_ctx: IndexHtmlTransformContext
45+
): IndexHtmlTransformResult => ejs.render(html, data),
46+
},
47+
};
48+
};
1849

19-
export default defineConfig(({ mode }): UserConfig => {
50+
export default defineConfig(async ({ mode }): Promise<UserConfig> => {
2051
const commonEnv = loadEnv(mode, process.cwd(), "");
2152

53+
const strings: TemplateStrings = themePackageExternal
54+
? // eslint-disable-next-line @typescript-eslint/no-unsafe-call, @typescript-eslint/no-unsafe-member-access
55+
((await import(themePackageAlias)).default({}) as TemplateStrings)
56+
: {
57+
appNameFull: "ml-trainer",
58+
ogDescription: undefined,
59+
metaDescription: undefined,
60+
};
2261
return {
2362
base: process.env.BASE_URL ?? "/",
24-
plugins: [react(), svgr()],
63+
plugins: [viteEjsPlugin(strings), react(), svgr()],
2564
define: {
2665
"import.meta.env.VITE_APP_VERSION": JSON.stringify(
2766
process.env.npm_package_version
@@ -57,9 +96,7 @@ export default defineConfig(({ mode }): UserConfig => {
5796
},
5897
resolve: {
5998
alias: {
60-
"theme-package": fs.existsSync(external)
61-
? theme
62-
: path.resolve(__dirname, internal),
99+
"theme-package": themePackageAlias,
63100
},
64101
},
65102
};

0 commit comments

Comments
 (0)