Svelte Environment Variables

---

Installation

npm install @dr-montasir/svelte-env-vars

How to use?

In the rollup.config.js file just add two lines of code like so

import addEnv from '@dr-montasir/svelte-env-vars';

and

addEnv()

1import addEnv from '@dr-montasir/svelte-env-vars'; // here line 1
2
3const production = !process.env.ROLLUP_WATCH;
4
5export default {
6    ...,
7    plugins : [
8      svelte({
9        compilerOptions: {
10          // enable run-time checks when not in production
11          dev: !production,
12        },
13      }),
14
15      addEnv(), // here line 2
16
17      // we'll extract any component CSS out into
18      // a separate file - better for performance
19      css({ output: 'bundle.css' }),
20      ...,
21    ],
22    ...
23}

.env file

Create .env in the svelte project root and for example add the API_URL as follow

1API_URL=http://localhost:5000/api

Make a test

Check the validity of configuration by adding console.log(process.env.API_URL); in any svelte component

1// App.svelte
2
3`<script>`
4  ...
5  console.log(process.env.API_URL);    // http://localhost:5000/api
6  ...
7`</script>`