How to import types for environment variables loaded from $env

[DePasqualeOrg]

I'm trying to use environment variables from $env/static/private, but I get the TypeScript error Cannot find module '$env/static/private' or its corresponding type declarations.. I'm guessing that I have to define the types under PrivateEnv in app.d.ts, but nothing I do there seems to work. Can someone provide a concrete example of how to use the types from $env?

[matiadev]

You shouldn't have to define anything!

Make sure you're using the latest version of SvelteKit and if that doesn't work try restarting the language server or deleting the .svelte-kit folder for good measure and see if that helps.

[DePasqualeOrg]

I'm using SvelteKit 1.0.0-next.465, and even after deleting .svelte-kit, running npm run build, and restarting VS Code, I still get the same error.

[matiadev]

# private
YOUR_SECRET_KEY=1234

# public
PUBLIC_KEY=1234

The PUBLIC_ prefix is important.

// private
import { YOUR_SECRET_KEY } from '$env/static/private'

// public
import { PUBLIC_KEY } from '$env/static/public'

That's it! 😄

[DePasqualeOrg]

Thanks, this is what I'm doing. The environment variables work, but TypeScript can't find the type declarations for some reason.

[matiadev]

Could it be your adapter version? 🤔

If I look at the generated ambient.d.ts file inside the .svelte-kit folder I can see the types there. I wonder do you see the same? Maybe you could try a fresh project or make a reproduction.

In my experience some of the type generation can sometimes be weird but I'm using it in production on a couple of projects and I never had a problem.

[DePasqualeOrg]

I'm using the latest version of the Node adapter. I also see the types for the environment variables in ambient.d.ts, but on the line import { PASSWORD } from '$env/static/private'; I get the TypeScript error Cannot find module '$env/static/private' or its corresponding type declarations.ts(2307).

[DePasqualeOrg]

I figured out that the types for $env weren't being imported because I was overriding include in tsconfig.json. This (new?) note in tsconfig.json in the SvelteKit skeleton project was the clue:

If you want to overwrite includes/excludes, make sure to copy over the relevant includes/excludes from the referenced tsconfig.json - TypeScript does not merge them in