summaryrefslogtreecommitdiff
path: root/docs/src
diff options
context:
space:
mode:
Diffstat (limited to 'docs/src')
-rw-r--r--docs/src/pages/en/guides/environment-variables.md17
1 files changed, 17 insertions, 0 deletions
diff --git a/docs/src/pages/en/guides/environment-variables.md b/docs/src/pages/en/guides/environment-variables.md
index 30ab36398..1d3b9cfef 100644
--- a/docs/src/pages/en/guides/environment-variables.md
+++ b/docs/src/pages/en/guides/environment-variables.md
@@ -29,3 +29,20 @@ fetch(`${import.meta.env.PUBLIC_POKEAPI}/pokemon/squirtle`);
> ⚠️WARNING⚠️:
> Because Vite statically replaces `import.meta.env`, you cannot access it with dynamic keys like `import.meta.env[key]`.
+
+## IntelliSense for TypeScript
+
+By default, Vite provides type definition for `import.meta.env` in `vite/client.d.ts`. While you can define more custom env variables in `.env.[mode]` files, you may want to get TypeScript IntelliSense for user-defined env variables which prefixed with `PUBLIC_`.
+
+To achieve, you can create an `env.d.ts` in `src` directory, then augment `ImportMetaEnv` like this:
+
+```ts
+interface ImportMetaEnv {
+ readonly PUBLIC_POKEAPI: string
+ // more env variables...
+}
+
+interface ImportMeta {
+ readonly env: ImportMetaEnv
+}
+```