Does $env/static/public not work with custom env directories?

Question

If I have an env file .env.development in the root directory, this works:

// .env.development
PUBLIC_FOO=foo

// foo.svelte
import { PUBLIC_FOO } from '$env/static/public';
...
console.log(PUBLIC_FOO); // works

However, if I have a custom env directory, it does not. But import.meta.env does work (for VITE_ properties as mentioned in the vite docs, but not PUBLIC_)

// env/.env.development
PUBLIC_FOO=foo
VITE_FOO=foo

// vite.config.ts
export default defineConfig({
  plugins: [sveltekit()],
  envDir: 'env',
  test: {
    include: ['src/**/*.{test,spec}.{js,ts}'],
  }
});

// foo.svelte
import { PUBLIC_FOO } from '$env/static/public';
...
console.log(PUBLIC_FOO); // does not work
console.log(import.meta.env.PUBLIC_FOO) // does not work
console.log(import.meta.env.VITE_FOO) // works

Update: I tried this too. Did not help:

export default defineConfig(({ mode }) => {
  loadEnv(mode, 'env', '');
  return {
    plugins: [sveltekit()],
    envDir: 'env',
    kit: {
      env: {
        dir: 'env',
      },
    },
    test: {
      include: ['src/**/*.{test,spec}.{js,ts}'],
    },
  };
});

Joe · Accepted Answer · 2024-06-19 09:55:36Z

2

Figured it out. The kit.env.dir property goes in svelte.config, not vite.config.

// svelte.config.js
const config = {
  preprocess: vitePreprocess(),
  kit: {
    adapter: adapter(),
    env: {
      dir: 'env',
    },
  },
};

answered Jun 19, 2024 at 9:55

Joe

4094 silver badges12 bronze badges

Sign up to request clarification or add additional context in comments.

Collectives™ on Stack Overflow

Does $env/static/public not work with custom env directories?

1 Answer 1

Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

1 Answer 1

Comments

Your Answer

Sign up or log in

Post as a guest

Related