From d309e8c6af46241c2e2047e0b1973802403a0764 Mon Sep 17 00:00:00 2001 From: Miorel-Lucian Palii Date: Fri, 8 Nov 2024 21:15:48 -0800 Subject: [PATCH] Generate Simon Game `index.html` during build We can use a custom `webpack` plugin, similar to the Adventure Pack. --- workspaces/generate-health-report/src/main.ts | 1 + workspaces/simon-game/.gitignore | 3 -- workspaces/simon-game/index.html | 13 ------ .../build/WriteIndexHtmlWebpackPlugin.tsx | 42 +++++++++++++++++++ workspaces/simon-game/webpack.config.ts | 9 +++- 5 files changed, 50 insertions(+), 18 deletions(-) delete mode 100644 workspaces/simon-game/index.html create mode 100644 workspaces/simon-game/src/scripts/build/WriteIndexHtmlWebpackPlugin.tsx diff --git a/workspaces/generate-health-report/src/main.ts b/workspaces/generate-health-report/src/main.ts index 0bae28ce..aa1f2c88 100644 --- a/workspaces/generate-health-report/src/main.ts +++ b/workspaces/generate-health-report/src/main.ts @@ -20,6 +20,7 @@ const COMMANDS = [ "yarn workspace @code-chronicles/leetcode-api codegen", "yarn workspace @code-chronicles/leetcode-zen-mode build", "yarn workspace @code-chronicles/post-leetcode-potd-to-discord build", + "yarn workspace @code-chronicles/simon-game build", ]; async function main(): Promise { diff --git a/workspaces/simon-game/.gitignore b/workspaces/simon-game/.gitignore index 98ccd57a..849ddff3 100644 --- a/workspaces/simon-game/.gitignore +++ b/workspaces/simon-game/.gitignore @@ -1,4 +1 @@ dist/ - -data.json -secrets_DO_NOT_COMMIT_OR_SHARE.json diff --git a/workspaces/simon-game/index.html b/workspaces/simon-game/index.html deleted file mode 100644 index 02ae02d9..00000000 --- a/workspaces/simon-game/index.html +++ /dev/null @@ -1,13 +0,0 @@ - - - - - Simon Game - - - - - -
- - diff --git a/workspaces/simon-game/src/scripts/build/WriteIndexHtmlWebpackPlugin.tsx b/workspaces/simon-game/src/scripts/build/WriteIndexHtmlWebpackPlugin.tsx new file mode 100644 index 00000000..f9530724 --- /dev/null +++ b/workspaces/simon-game/src/scripts/build/WriteIndexHtmlWebpackPlugin.tsx @@ -0,0 +1,42 @@ +import React from "react"; +import ReactDOMServer from "react-dom/server"; +import type { Compiler } from "webpack"; + +import { App } from "../../app/components/App.tsx"; + +export class WriteIndexHtmlWebpackPlugin { + apply(compiler: Compiler) { + compiler.hooks.compilation.tap(this.constructor.name, (compilation) => { + compilation.hooks.processAssets.tap( + { + name: this.constructor.name, + stage: compiler.webpack.Compilation.PROCESS_ASSETS_STAGE_ADDITIONAL, + }, + () => { + compilation.emitAsset( + "index.html", + new compiler.webpack.sources.RawSource( + "\n" + + ReactDOMServer.renderToStaticMarkup( + + + + Simon Game +