Create-react-app: .env NODE_PATH is not working in v1.1.0

Created on 30 Jan 2018  路  10Comments  路  Source: facebook/create-react-app

bug
In reference to the same issue: https://github.com/facebook/create-react-app/issues/2230
NODE_PATH is ignored when defined in .env file.

And that contradicts the latest docs.

You can adjust various development and production settings by setting environment variables in your shell or with .env.
NODE_PATH: Same as NODE_PATH in Node.js, but only relative folders are allowed. Can be handy for emulating a monorepo setup by setting NODE_PATH=src.

Why does it happen?
It happens because NODE_PATH should be configured when config/env.js executes.

And dotenv module does not modify existing variables.

We will never modify any environment variables that have already been set. In particular, if there is a variable in your .env file which collides with one that already exists in your environment, then that variable will be skipped.

https://github.com/facebook/create-react-app/blob/5348d6eecf208a6298e48072314157804282002e/packages/react-scripts/config/env.js#L36-L49

So the code will simply fail to append NODE_PATH from an .env file to process.env.NODE_PATH variable that is used to provide this feature

https://github.com/facebook/create-react-app/blob/5348d6eecf208a6298e48072314157804282002e/packages/react-scripts/config/env.js#L60-L65

Solution

Manually add NODE_PATH string received from the dotenv.configure parsed property.

{ 
  parsed: { 
    NODE_PATH: 'src',
    REACT_APP_ELSE: 'foo' 
  } 
}
question

Most helpful comment

I use the NODE_PATH variable for absolute imports, is there any other solution to this?

All 10 comments

@gaearon: Thanks for confirming. Would be good if somebody could take a peek in the source into why. I'd expect it to work. https://github.com/facebook/create-react-app/issues/2230#issuecomment-302669366

My humble findings.

You can not override environment variables that already exist. Default Node installation exposes such env var so you can't override it. Consider using nvm. It makes Node version switching easier, also does not pollute NODE_PATH.

@miraage, of course! That would not be a good practice.

I should probably clarify myself. I propose expanding NODE_PATH with the results from from dotenv.

dotenvFiles.forEach(dotenvFile => {
  if (fs.existsSync(dotenvFile)) {
    var results = require('dotenv-expand')(
      require('dotenv').config({
        path: dotenvFile,
      })
    );

    if (results.parsed.NODE_PATH !== undefined) {
      process.env.NODE_PATH += results.parsed.NODE_PATH;
    }
  }
});

I don't think it makes a lot of sense to treat NODE_PATH differently from other environment variables.

I strongly recommend against setting a global NODE_PATH variable on your system.

It doesn't, make a lot of sense. It is just that the docs are not aligned with the feature set.

Same as NODE_PATH in Node.js, but only relative folders are allowed. Can be handy for emulating a monorepo setup by setting NODE_PATH=src.

I think it would be best to just remove this line from the docs and close the issue.
If it is important to anybody else, it will resurface.

Another idea, would be to add REACT_APP_FAKE_MONOREPO var that would cover a big number of use cases for NODE_PATH .env variable

I use the NODE_PATH variable for absolute imports, is there any other solution to this?

setting NODE_PATH=src in .env is not working for me, create-react-app version 1.5.2, i've tried to import components like 'components/Nav', however it throws Module not found: Can't resolve 'components/Nav' in '/home/yash/my-app/src', however if i run NODE_PATH=src react-scripts start it's working,
i checked by console.log(process.env) it show object { NODE_ENV:"development", PUBLIC_URL:""}

@yasharma this is the correct behavior -- the environment variable set in your shell will always win over one in a .env file.

@Timer yes that's correct , however if i remove shell environment variable and want to use .env vars , its not working in that case, setting NODE_PATH=src in .env

That problem caused me a big headache. Thanks for everyone. zo/

Was this page helpful?
0 / 5 - 0 ratings

Related issues

adrice727 picture adrice727  路  3Comments

fson picture fson  路  3Comments

stopachka picture stopachka  路  3Comments

alleroux picture alleroux  路  3Comments

jnachtigall picture jnachtigall  路  3Comments