How to access environment variables inside React JS web app?

Question

I have an environment variable that I need to access inside my render method. Since its a custom ENV variable, I cannot use (process.env.NODE_ENV). I have read that React sanitises all process.env access.

How to access my custom environment variable (CLUSTER_ENV) inside React web app?

Rajaprabhu Aravindasamy · Accepted Answer · 2020-11-09 11:12:22Z

13

If you are using webpack, it is possible with Webpack Define plugin.

webpack.config.js:

    ...
    plugins: [
     new webpack.DefinePlugin({
       'NODE_ENV': JSON.stringify(process.env.NODE_ENV)
     })
    ]      
    ...

and then simply you can use on your javascript file.

console.log(NODE_ENV);

edit: not alias, define plugin.

edited Nov 9, 2020 at 11:12

Rajaprabhu Aravindasamy

67.2k17 gold badges107 silver badges133 bronze badges

answered Sep 19, 2017 at 11:04

arikanmstf

4737 silver badges16 bronze badges

Sign up to request clarification or add additional context in comments.

1 Comment

Mariya James Over a year ago

I am using react meteor application, I need to use these env varible in react component, I am having babel rather than webpack

Collectives™ on Stack Overflow

How to access environment variables inside React JS web app?

1 Answer 1

1 Comment

Your Answer

Linked

Hot Network Questions

Collectives™ on Stack Overflow

1 Answer 1

1 Comment

Your Answer

Sign up or log in

Post as a guest

Linked

Related