[WEB-5419] chore: add dotenv dependency, hosts and configure environment variables in admin, space, and web apps (#8107)

* chore: add dotenv dependency and configure environment variables in admin, space, and web apps

* chore: allowed multiple hosts in dev mode

* chore: move dotenv to dev deps

* chore: update Vite configuration to set server host to 127.0.0.1 for admin, space, and web apps

---------

Co-authored-by: gakshita <akshitagoyal1516@gmail.com>

apps/admin/package.json

@@ -56,6 +56,7 @@
     "@types/node": "catalog:",
     "@types/react": "catalog:",
     "@types/react-dom": "catalog:",
+    "dotenv": "^16.4.5",
     "typescript": "catalog:",
     "vite": "catalog:",
     "vite-tsconfig-paths": "^5.1.4"

apps/admin/vite.config.ts

@@ -1,9 +1,12 @@
 import path from "node:path";
 import { reactRouter } from "@react-router/dev/vite";
+import dotenv from "dotenv";
 import { defineConfig } from "vite";
 import tsconfigPaths from "vite-tsconfig-paths";
 import { joinUrlPath } from "@plane/utils";
 
+dotenv.config({ path: path.resolve(__dirname, ".env") });
+
 // Expose only vars starting with VITE_
 const viteEnv = Object.keys(process.env)
   .filter((k) => k.startsWith("VITE_"))
@@ -32,5 +35,8 @@ export default defineConfig(() => ({
     },
     dedupe: ["react", "react-dom"],
   },
+  server: {
+    host: "127.0.0.1",
+  },
   // No SSR-specific overrides needed; alias resolves to ESM build
 }));

apps/space/package.json

@@ -62,6 +62,7 @@
     "@types/node": "catalog:",
     "@types/react": "catalog:",
     "@types/react-dom": "catalog:",
+    "dotenv": "^16.4.5",
     "typescript": "catalog:",
     "vite": "catalog:",
     "vite-tsconfig-paths": "^5.1.4"

apps/space/vite.config.ts

@@ -1,9 +1,12 @@
 import path from "node:path";
 import { reactRouter } from "@react-router/dev/vite";
+import dotenv from "dotenv";
 import { defineConfig } from "vite";
 import tsconfigPaths from "vite-tsconfig-paths";
 import { joinUrlPath } from "@plane/utils";
 
+dotenv.config({ path: path.resolve(__dirname, ".env") });
+
 // Expose only vars starting with VITE_
 const viteEnv = Object.keys(process.env)
   .filter((k) => k.startsWith("VITE_"))
@@ -32,4 +35,7 @@ export default defineConfig(() => ({
     },
     dedupe: ["react", "react-dom"],
   },
+  server: {
+    host: "127.0.0.1",
+  },
 }));

apps/web/package.json

@@ -85,6 +85,7 @@
     "@types/react": "catalog:",
     "@types/react-color": "^3.0.6",
     "@types/react-dom": "catalog:",
+    "dotenv": "^16.4.5",
     "prettier": "^3.2.5",
     "typescript": "catalog:",
     "vite": "catalog:",

apps/web/vite.config.ts

@@ -1,8 +1,11 @@
 import path from "node:path";
 import { reactRouter } from "@react-router/dev/vite";
+import dotenv from "dotenv";
 import { defineConfig } from "vite";
 import tsconfigPaths from "vite-tsconfig-paths";
 
+dotenv.config({ path: path.resolve(__dirname, ".env") });
+
 // Expose only vars starting with VITE_
 const viteEnv = Object.keys(process.env)
   .filter((k) => k.startsWith("VITE_"))
@@ -29,5 +32,8 @@ export default defineConfig(() => ({
     },
     dedupe: ["react", "react-dom", "@headlessui/react"],
   },
+  server: {
+    host: "127.0.0.1",
+  },
   // No SSR-specific overrides needed; alias resolves to ESM build
 }));

pnpm-lock.yaml

@@ -218,6 +218,9 @@ importers:
       '@types/react-dom':
         specifier: 'catalog:'
         version: 18.3.1
+      dotenv:
+        specifier: ^16.4.5
+        version: 16.6.1
       typescript:
         specifier: 5.8.3
         version: 5.8.3
@@ -478,6 +481,9 @@ importers:
       '@types/react-dom':
         specifier: 'catalog:'
         version: 18.3.1
+      dotenv:
+        specifier: ^16.4.5
+        version: 16.6.1
       typescript:
         specifier: 5.8.3
         version: 5.8.3
@@ -689,6 +695,9 @@ importers:
       '@types/react-dom':
         specifier: 'catalog:'
         version: 18.3.1
+      dotenv:
+        specifier: ^16.4.5
+        version: 16.6.1
       prettier:
         specifier: ^3.2.5
         version: 3.6.2