Replace REACT_ environment variables

Vite ignores all environment variables which do not start with VITE_.
dennis531 · Mar 18, 2024 · ce9e402 · ce9e402
1 parent 56ed7ed
commit ce9e402
Show file tree

Hide file tree

Showing 4 changed files with 10 additions and 5 deletions.
diff --git a/.github/build-release.sh b/.github/build-release.sh
@@ -3,7 +3,7 @@
 # Build integrated version
 rm -rf build/
 export PUBLIC_URL=/editor-ui
-export REACT_APP_SETTINGS_PATH="/ui/config/editor/editor-settings.toml"
+export VITE_APP_SETTINGS_PATH="/ui/config/editor/editor-settings.toml"
 npm run build
 
 FILENAME="oc-editor-$(date --utc +%F).tar.gz"

diff --git a/index.html b/index.html
@@ -1,8 +1,8 @@
 <!DOCTYPE html>
 <html lang="en">
   <head>
-    <meta name="git-commit" content="%REACT_APP_GIT_SHA%">
-    <meta name="build-date" content="%REACT_APP_BUILD_DATE%">
+    <meta name="git-commit" content="%VITE_GIT_COMMIT_HASH%">
+    <meta name="build-date" content="%VITE_APP_BUILD_DATE%">
     <meta charset="utf-8" />
     <link rel="icon" href="/favicon.ico" />
     <meta name="viewport" content="width=device-width, initial-scale=1" />

diff --git a/src/config.ts b/src/config.ts
@@ -185,10 +185,10 @@ const loadContextSettings = async () => {
     basepath += "/";
   }
 
-  // Construct path to settings file. If the `REACT_APP_SETTINGS_PATH` is
+  // Construct path to settings file. If the `VITE_APP_SETTINGS_PATH` is
   // given and starts with "/", it is interpreted as absolute path from the
   // server root.
-  const settingsPath = import.meta.env.REACT_APP_SETTINGS_PATH || CONTEXT_SETTINGS_FILE;
+  const settingsPath = import.meta.env.VITE_APP_SETTINGS_PATH || CONTEXT_SETTINGS_FILE;
   const base = settingsPath.startsWith("/") ? "" : basepath;
   const url = `${window.location.origin}${base}${settingsPath}`;
   let response;

diff --git a/vite.config.ts b/vite.config.ts
@@ -2,6 +2,9 @@ import { defineConfig } from "vite";
 import react from "@vitejs/plugin-react";
 import svgr from "vite-plugin-svgr";
 import eslint from "vite-plugin-eslint";
+import child from "child_process";
+
+const commitHash = child.execSync("git rev-parse HEAD").toString().trim();
 
 // https://vitejs.dev/config/
 export default defineConfig(() => {
@@ -26,6 +29,8 @@ export default defineConfig(() => {
     // Workaround, see https://github.com/vitejs/vite/discussions/5912#discussioncomment-6115736
     define: {
       global: "globalThis",
+      'import.meta.env.VITE_GIT_COMMIT_HASH': JSON.stringify(commitHash),
+      'import.meta.env.VITE_APP_BUILD_DATE': JSON.stringify(new Date().toISOString()),
     },
     test: {
       globals: true,