Introduce import-meta-env for frontend

MTES-MCT · Mar 11, 2024 · 21f111c · 21f111c
1 parent 3d10a1b
commit 21f111c
Show file tree

Hide file tree

Showing 13 changed files with 639 additions and 61 deletions.
diff --git a/frontend/.env.d.ts b/frontend/.env.d.ts
@@ -0,0 +1,10 @@
+// https://vitejs.dev/guide/env-and-mode#intellisense-for-typescript
+/// <reference types="vite/client" />
+
+interface ImportMetaEnv {
+  readonly FRONTEND_SENTRY_DSN: string
+}
+
+interface ImportMeta {
+  readonly env: ImportMetaEnv
+}
diff --git a/frontend/.env.example b/frontend/.env.example
@@ -0,0 +1,5 @@
+
+################################################################################
+# Sentry
+
+FRONTEND_SENTRY_DSN=https://[email protected]/121
diff --git a/frontend/.env.local.defaults b/frontend/.env.local.defaults
@@ -0,0 +1,4 @@
+################################################################################
+# Sentry
+
+FRONTEND_SENTRY_DSN=https://[email protected]/121
diff --git a/frontend/.gitignore b/frontend/.gitignore
@@ -1,11 +1,24 @@
 # See https://help.github.com/articles/ignoring-files/ for more about ignoring files.
 
+# env
 .env
+.env.local
+.env.development
+.env.development.local
+.env.staging
+.env.staging.local
+.env.production
+.env.production.local
+.env.test
+.env.test.local
 
 # dependencies
 /node_modules
 /.pnp
 .pnp.js
+npm-debug.log*
+yarn-debug.log*
+yarn-error.log*
 
 # testing
 /coverage
@@ -16,11 +29,3 @@
 
 # misc
 .DS_Store
-.env.local
-.env.development.local
-.env.test.local
-.env.production.local
-
-npm-debug.log*
-yarn-debug.log*
-yarn-error.log*
diff --git a/frontend/index.html b/frontend/index.html
@@ -9,7 +9,16 @@
   <link rel="manifest" href="./manifest.json"/>
 </head>
 <body>
+<!-- React root -->
 <div id="root"></div>
+
+<!-- This script will be used by the `import-meta-env` library to inject -->
+<!-- runtime environment variables when running in production -->
+<!-- see: https://import-meta-env.org/guide/getting-started/introduction.html -->
+<script>
+  globalThis.import_meta_env = JSON.parse('"import_meta_env_placeholder"')
+</script>
+
 <script type="module" src="/src/index.tsx"></script>
 </body>
 </html>