I've been developing a React app using dotenv, with create-react-app, and when it came to building for production, the build failed due to some ES6 code in dotenv:
> react-scripts build
Creating an optimized production build...
Failed to compile.
Failed to minify the code from this file:
./node_modules/dotenv/lib/main.js:23
Read more here: http://bit.ly/2tRViJ9
I've been able to fix this myself by compiling dotenv to ES5 manually, but think it'd be a good idea for dotenv be published to npm pre-compiled to ES5, to prevent other people from running into similar issues in the future.
You should not be including dotenv in client bundles as it relies on the file system and populates process.env which is a Node.js construct. Instead, it may be useful _during_ the build process as create-react-app is doing here
What about projects that have both a client and server folder in the same repo?
@elie222 I just ran into a similar issue. I have a client and server running concurrently on one of my apps. It doesn't seem like there is a workaround for this if the client and server are sharing the same package.json. The only solution that comes to mind is to have separate package.json files for both folders, and only adding the dotenv dependency to the server folder that doesn't use create-react-app's build process.
@danielrvoigt @elie222 whether the client and server are in the same repo, or even in the same package (sharing a package.json) makes no difference. Your bundler (webpack if you are using create-react-app) will only pull in the modules that are imported (or required) by your client code. If you have a minimal reproduction I would be happy to take a look at what's going wrong.
SOLUTION HERE:
I realize this issue has been created 3 times and I did take the time to read through them. I'm not sure what the solution is to get around this issue if I'm using dotenv in my development environment. Comment out all the dotenv code before building?
I tried installing dotenv as a dev only dependency with the same error. I am using the latest version of react-scripts from CRA (1.1.4) Thank you.
EDIT: I was looking to solve this in my server code. I didn't realize that the client side index.js file I had included the dotenv package and this is what was breaking on build.
Create-react-app doesn鈥檛 need dotenv. It already reads the env file looking for REACT_APP vars.
So in the Index component, just remove this line.
# import 'dotenv/config'
import enableDebugger from './helpers/enableDebugger'
if (process.env.REACT_APP_DEBUG) enableDebugger()
I had this problem also with an outdated Create React App project. Just remove the following from the index.js file. Create React App projects don't include this anymore.
import dotenv from 'dotenv';
dotenv.config();
Make npm install --save @types/node. It works for me.
I have found some node dependencies like 'fs' and others in dotenv module.
Just comment these line and it will be fine:
import dotenv from 'dotenv';
dotenv.config();
Most helpful comment
I had this problem also with an outdated Create React App project. Just remove the following from the index.js file. Create React App projects don't include this anymore.