Module not found: Error: Can't resolve 'fs' in node_modules\dotenv\lib'

Question

I'm trying to use dotenv with an angle, but when it comes to requiring dotenv

 require('dotenv').config()  
 or
 const Dotenv = require('dotenv-webpack');

I get the following error:

ERROR in ./node_modules/dotenv/lib/main.js Module not found: Error: Can't resolve 'fs' in 'C:\Users\57322\Favorites\Proyecto\core4edu\node_modules\dotenv\lib'

package.json

"dotenv": "^8.2.0",
"dotenv-webpack": "^1.7.0",

Have you checked this answer? https://github.com/motdotla/dotenv/issues/233 — Roy, Jan 25 '20 at 17:44

score 23 · Answer 1 · edited Jan 16 '22 at 11:34

23

I think the problem is related to webpack, I had the same problem on a next.js project and here is how I did to fix the problem.

Create file conf.js in root folder

I created a next.conf.js file in my root folder where there is my .env file, I imported dotenv and I exported the module where there is all my environment and these variables as if below.

export module dot env

Finally in my index file and my components I don’t need to import dotenv, I just need to paste my process.env.API_URL.

you dont need to import dotenv in index

I hope this example solves your problem.

edited Jan 16 '22 at 11:34

Hamza

171
1
10

answered May 29 '20 at 19:59

Sidouxie

347
2
6

Did not work for me. I get `'REACT_APP_MY_ENV_VAR' is not defined.` in the `next.conf.js` file. What calls `next.conf.js`, how do I know it's being used? – Paul Aug 16 '21 at 22:48
2

Worked for me except, I had to use colon instead of = env: { YB_RAILS: process.env.YB_RAILS, }, – PhilCowan Dec 14 '21 at 20:26
In NEXT JS, there is a built-in support for loading variables actually, You dont need to specifically find a loader – Jan 21 '22 at 09:51
1

Thank you sir, been at this the whole day ! :D Genius ;) – heyooo12 Mar 04 '22 at 13:54

score 13 · Answer 2 · edited Nov 16 '21 at 12:49

I had a similar situation - working in the webpack development mode, installing dotenv, getting an error "Module not found: Error: Can't resolve 'fs' in node_modules\dotenv\lib'".

I uninstalled dotenv and stayed just with dotenv-webpack for development. I configured the webpack.config.js as it is written in docs.

Everything works now. Env variables are accessible globally without creating any additional file.

score 10 · Answer 3 · edited Apr 27 '23 at 13:36

10

If you encounter this error with a create-react-app app, you need to go to the react-scripts webpack config.

In your webpack.config.js under 'resolve':

resolve: {
  // ...
  // add the fallback setting below 
  fallback: {
    "fs": false,
    "os": false,
    "path": false
  },
  // ...
}

edited Apr 27 '23 at 13:36

user16217248

3,119
19
19
37

answered Feb 02 '22 at 23:32

E G

498
6
7

2

Editing node_modules wouldn't be the right solution if you're collaborating with others. They would still face this error on every fresh npm install – Nihal Dias Mar 07 '23 at 13:11

score 6 · Answer 4 · edited Jul 14 '23 at 16:10

6

I faced a similar problem. dotenv-webpack installation will suffice. It is the dotenv require statement which is causing problem. Remove that and you will be good to go!

require('dotenv').config(); // Remove this line

edited Jul 14 '23 at 16:10

dwb

2,136
13
27

answered Feb 04 '22 at 07:37

aayush612

83
2
7

score 1 · Answer 5 · answered Jun 24 '22 at 15:11

I solved a similar problem for myself as follows:

create a file next.config.js in root directory
which contains the following code:

module.exports = {
  env: {
    REACT_APP_API_HOST:'http://localhost:5001',
  },
}

and after that, the variable REACT_APP_API_HOST became available in client part of my Next.js application as process.env.REACT_APP_API_HOST

score 0 · Answer 6 · answered Oct 18 '20 at 09:19

0

This little addition to package.json starting from Angular 9 (confirmed on Angular 10) fixes this problem.

...
"browser": {
  "fs": false
},
...

answered Oct 18 '20 at 09:19

Daniel Danielecki

8,508
6
68
94

score 0 · Answer 7 · edited Nov 05 '21 at 05:58

0

I want to also add TypeScript code on top of @Sidouxie's solution:

Create a file that ends with .d.ts in your root directory.

Add this to the file:

declare global {
 namespace NodeJS {
   interface ProcessEnv {
     API_URL:string;
   }
  }
}

This will globally check your environment variables in your TypeScript project.

edited Nov 05 '21 at 05:58

Jeremy Caney

7,102
69
48
77

answered Nov 04 '21 at 20:02

Ömer Ayhan

73
1
4

score 0 · Answer 8 · answered May 25 '23 at 18:40

0

I was having the same problem, this was the solution for me enter link description here

answered May 25 '23 at 18:40

Will Diaz

1
1

As it’s currently written, your answer is unclear. Please [edit] to add additional details that will help others understand how this addresses the question asked. You can find more information on how to write good answers [in the help center](/help/how-to-answer). – Community May 25 '23 at 22:47

Module not found: Error: Can't resolve 'fs' in node_modules\dotenv\lib'

8 Answers8

Linked