Skip to content

Using dotenv .env config file correctly #865

Closed
@lovegrovegeorge

Description

@lovegrovegeorge

Description

How the .env file and imports should be setup for the project correctly as currently the build is breaking.

Expected behavior

  • add .env file with config in root
  • npm install --save dotenv
  • import dotenv using require('dotenv').config(); or ES6 syntax in index.js file
  • consume using process.env.CONFIG_NAME across application

Actual behavior

screen shot 2016-10-06 at 17 45 24

Using the expected behaviour approach I get the above error. I've also tried both installing dotenv and not installing it (as ejecting the repository shows dotenv is already a dependency).

Environment

react-scripts@0.6.1
node - v6.6.0
npm - 3.10.8

Using a Chrome (53.0.2785.143) on a Mac.

Activity

zackify

zackify commented on Oct 6, 2016

@zackify

I'm trying to get this working too, I don't think you are supposed to actually install dotenv. For some reason env variables are not being imported from my .env file though.... so I am having a similar problem.

amilajack

amilajack commented on Oct 7, 2016

@amilajack

@zackify Are you on windows?

shrynx

shrynx commented on Oct 7, 2016

@shrynx
Contributor
zackify

zackify commented on Oct 7, 2016

@zackify

No. mac os sierra.
On Thu, Oct 6, 2016 at 22:28 Amila Welihinda notifications@github.com
wrote:

@zackify https://github.com/zackify Are you on windows?


You are receiving this because you were mentioned.
Reply to this email directly, view it on GitHub
#865 (comment),
or mute the thread
https://github.com/notifications/unsubscribe-auth/AAbacK7VBi5QJtdlCEfjXgZ6LtcdiuYwks5qxa5ggaJpZM4KQK0_
.

zackify

zackify commented on Oct 7, 2016

@zackify

Thanks but I have already. I have added the file. I'm using dotenv on other
projects and it works fine. In this case, I'm on the latest version of
create react app. Made a .env file at the root. Process.env is an empty
object in the app. Really weird for sure....
On Thu, Oct 6, 2016 at 22:29 Shriyans notifications@github.com wrote:

@georgelovegrove https://github.com/georgelovegrove @zackify
https://github.com/zackify
Please have a look at this,for adding env variables.

https://github.com/facebookincubator/create-react-app/blob/master/packages/react-scripts/template/README.md#adding-custom-environment-variables


You are receiving this because you were mentioned.
Reply to this email directly, view it on GitHub
#865 (comment),
or mute the thread
https://github.com/notifications/unsubscribe-auth/AAbacLSpvpJBJEzMc7c2C42haipHxJqcks5qxa6XgaJpZM4KQK0_
.

shrynx

shrynx commented on Oct 7, 2016

@shrynx
Contributor

@georgelovegrove @zackify Is your os sierra too ? i am unable to reproduce it.
Also to add one more thing , in your .env file , what are the names of env variables. You have to append REACT_APP_ to them , to make it work.
eg:
This works.

REACT_APP_SECRET=mySecret  👍

and this doesn't

SECRET=anotherSecret 👎 
lovegrovegeorge

lovegrovegeorge commented on Oct 7, 2016

@lovegrovegeorge
Author

I'm on OS Sierra but @shrynx made me look closer at the information I read before. I missed the appending 'REACT_APP_' to the start of the key. That's a bit of a verbose pain to add that to every key, could that not be shortened or removed entirely in the scripts?

Closing now, thanks for help.

gaearon

gaearon commented on Oct 7, 2016

@gaearon
Contributor

It is intentionally verbose. Otherwise there is a risk of accidentally exposing a private key on the machine that happens to have the same name.

lovegrovegeorge

lovegrovegeorge commented on Oct 7, 2016

@lovegrovegeorge
Author

@gaearon fair point, may be worth a one liner in the docs. p.s thanks for redux! aha

gaearon

gaearon commented on Oct 7, 2016

@gaearon
Contributor

@georgelovegrove PRs are welcome to the docs 😉

lovegrovegeorge

lovegrovegeorge commented on Oct 7, 2016

@lovegrovegeorge
Author

@gaearon Won't have the finesse to explain why that you will #juniordevforlife

gaearon

gaearon commented on Oct 7, 2016

@gaearon
Contributor

But you know the right place to put it. We can polish the message later, PR is a start.

zackify

zackify commented on Oct 7, 2016

@zackify

Haha! Knew there had to be something simple. Agree, it's a little confusing
especially if you are used to setting up env files yourself.
On Fri, Oct 7, 2016 at 06:53 Dan Abramov notifications@github.com wrote:

But you know the right place to put it. We can polish the message later,
PR is a start.


You are receiving this because you were mentioned.
Reply to this email directly, view it on GitHub
#865 (comment),
or mute the thread
https://github.com/notifications/unsubscribe-auth/AAbacMKHz45JK1x8FrRQDY0vVXV8U64Dks5qxiSrgaJpZM4KQK0_
.

17 remaining items

Loading
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment

Metadata

Metadata

Assignees

No one assigned

    Labels

    No labels
    No labels

    Type

    No type

    Projects

    No projects

    Milestone

    No milestone

    Relationships

    None yet

      Development

      No branches or pull requests

        Participants

        @DanielBaird@zackify@gaearon@shrynx@cdriehuys

        Issue actions

          Using dotenv .env config file correctly · Issue #865 · facebook/create-react-app