Parcel: How can I use the environment variables defined in .env inside my app?

Created on 18 Mar 2019 · 8Comments · Source: parcel-bundler/parcel

The documentation says that Parcel supports .env files, so I created one like this:

ENV_KEY=value

And, I tried to get the ENV_KEY value using process.env.ENV_KEY, but it returns empty.

<!-- index.html -->
<!DOCTYPE html>
<html>
<!-- head, etc -->
<body>
    <div id='root'></div>
    <script src='app.jsx'></script>
</body>
</html>

// app.jsx
import React from 'react'
import ReactDOM from 'react-dom'

ReactDOM.render(
    <div>
        The "ENV_KEY" value is: { process.env.ENV_KEY }
    </div>,
    document.getElementById('root')
)

Running it with parcel index.html.

How can I use the environment variables defined in .env inside my app?

Question

Source

rn4n

👍3

Most helpful comment

Is it normal to use this repository to ask questions instead of the StackOverflow?

I don't think there's a large community that really knows how Parcel works (and it's so young that many of these questions could actually be bugs).

I was about to add this to the website, but it turns out:

.env files are to be stored alongside the package.json that contains your parcel-bundler dependency.

mischnic on 18 Mar 2019

👍2

All 8 comments

Your code should work. Is the .env file next to your package.json?

mischnic on 18 Mar 2019

@mischnic thank you, solved it putting .env in the same folder of package.json.

Is it normal to use this repository to ask questions instead of the StackOverflow?

rn4n on 18 Mar 2019

Is it normal to use this repository to ask questions instead of the StackOverflow?

I don't think there's a large community that really knows how Parcel works (and it's so young that many of these questions could actually be bugs).

I was about to add this to the website, but it turns out:

.env files are to be stored alongside the package.json that contains your parcel-bundler dependency.

mischnic on 18 Mar 2019

👍2

Is it normal to use this repository to ask questions instead of the StackOverflow?

I don't think there's a large community that really knows how Parcel works (and it's so young that many of these questions could actually be bugs).

I was about to add this to the website, but it turns out:

.env files are to be stored alongside the package.json that contains your parcel-bundler dependency.

We could open now the tab "discussion" for that. It's so great. I use it on Next.js.

kud on 13 May 2020

We could open now the tab "discussion" for that. It's so great. I use it on Next.js.

We'd love to have that, but apparently their beta is still somewhat closed.
(For now there's https://spectrum.chat/parcel)

mischnic on 13 May 2020

👍1

Oh noooooooooo :((((

Okay thank you for the link!

kud on 13 May 2020

You sure @mischnic ? It's just that you need to do it on organisation, not the repo/project itself.

cf on one of my team:

kud on 13 May 2020

You're right. Discussions are available in "private" mode for users already members of an orga or project, but it's not available yet as public (for everybody).

kud on 13 May 2020

Was this page helpful?

0 / 5 - 0 ratings