Latest npm package is not working

[sadashivm]

Hi @toddbluhm
I'm using your npm package in react js application. it is not working properly
I used below steps:

1. Install package locally
   npm i env-cmd

2. In package.json looks like

   

3. Created a .env-cmdrc file in the root directory and structure as

   

4. Finally updated scripts object in package.json file like

   

5. run the below commond
   npm start

6. Got the below error

   

Please let me know if I've missed out anything.

[pgprateekgarg2]

Replace env-cmd with ./node_modules/.bin/env-cmd -f
It will work fine then.

[toddbluhm]

You should use the following command in your package.json: env-cmd -e dev react-scripts start. Per the docs, in version 10.x and higher, when using a .rc file the environment must be specified using the -e flag.

[nodabladam]

Note that this error can happen if your file is broken. In my case I accidentally forgot to end a line in my .env-cmd.js file with a comma and then it started acting like the file was gone. I think the latest version is swallowing the critical part of the error. Previous version will give something like:

SyntaxError: Unexpected identifier
    at Module._compile (internal/modules/cjs/loader.js:723:23)
    ...
    at Object.getRCFileVars (\node_modules\env-cmd\dist\parse-rc-file.js:26:33)
Error: Unable to locate .rc file at default locations (./.env-cmdrc,./.env-cmdrc.js,./.env-cmdrc.json)

Current version only seems to show the "Unable to locate .rc file" part.

[alexolivas]

I have pretty much the same setup as the original poster, but am still getting the same error even when I provide the -e flag.

And an .env-cmdrc file (at the root of the project - same location as package.json) that looks like this:

{
    "dev": {
        "REACT_APP_ENVIRONMENT": "development",
        "REACT_APP_API_URL": "https://some-dev.endpoint.io"
    },
    "stage": {
        "REACT_APP_ENVIRONMENT": "stage",
        "REACT_APP_API_URL": "https://some-stage.endpoint.io"
    },
    "production": {
        "REACT_APP_ENVIRONMENT": "production",
        "REACT_APP_API_URL": "https://some-prod.endpoint.io"
    }
}

[alexolivas]

I confirmed locally, that there is a bug on the latest version 10.1.0. When I downgraded to the previous version 10.0.1 the same command above (npm run start:stage) worked.

[toddbluhm]

@alexolivas could you set up an example repo for this? My tests/example repos are showing .rc files working as expected, but I don't have/use react-scripts so perhaps something else is causing the issue. An example repo would really help me pin this issue down 😄

You could also try passing the --verbose option to see if that gives any more helpful information?

The example tests that I use to test the functionality are located here: https://github.com/toddbluhm/env-cmd-examples/tree/master/examples/rc-file

[sadashivm]

@toddbluhm ,
It is working fine if i add -e flag in package.json file and I can access variables only if I add REACT_APP_ as prefix. See below

For nested object it is not working.

And output come like,

Any idea to fetch the nested objects value ? it is coming as [object object]

[toddbluhm]

@sadashivm That is correct behavior.

env-cmd was not designed to support nested objects. I am curious as to why you want nested values for an environment variable? Environment variables are almost by definition supposed to be simple values (strings, numbers, booleans). How would nested objects even work? What would the expected behavior of the keys be?

If you want to create a nested object, you can stringify the object yourself like this.

{
  "development": {
     "REACT_APP_ENV1": "{ "REACT_APP_ENV2": "nested value 1", "REACT_APP_ENV3": "nested value 2" }",
     "REACT_APP_ENV4": "thank you"
  }
}

Then you will have to access the nested values like this:

const obj = JSON.parse(process.env.REACT_APP_ENV1)
console.log(obj.REACT_APP_ENV2) // prints "nested value 1"
console.log(obj.REACT_APP_ENV3) // prints "nested value 2"

However, if you're saying you want to be able to access the values like this:

process.env.REACT_APP_ENV1
process.env.REACT_APP_ENV2
process.env.REACT_APP_ENV3
process.env.REACT_APP_ENV4

then you would need to have those values at the top level of the .env file

{
  "development": {
     "REACT_APP_ENV1": "some value",
     "REACT_APP_ENV2": "nested value 1",
     "REACT_APP_ENV3": "nested value 2",
     "REACT_APP_ENV4": "thank you"
  }
}

At this time I do not plan on adding any advanced nesting features to this project. I certainly could be convinced otherwise, but it would have to be something already standardized and with reasonable/expected behavior. Currently, nesting can be implemented via the solution above without any changes to env-cmd

Hopefully, that helps answer your issue 😄

[sadashivm]

@toddbluhm ,
Thank you so much for response.

[toddbluhm]

Closing due to inactivity