How to add environment variables to package.json

Viewed 1030

I'm using React Boilerplate and had a .env separately at the root to denote whether my server was development, staging or production. However, I realized that for my setup, that was not the best route. Then I learned that in package.json there is a block of code that actually shows environment variables for production, shown below:

"babel": {
    "env": {
        "production": {
            "only": [
                "app"
            ],
            "plugins": [
                "transform-react-remove-prop-types",
                "transform-react-constant-elements",
                "transform-react-inline-elements"
            ]
        },
        "test": {
            "plugins": [
                "transform-es2015-modules-commonjs",
                "dynamic-import-node"
            ]
        }
    }
}

From here, I would like to add development and staging but I keep getting a webpack error that says

Unknown option: C:\folders\blah\project\package.json.development.VARIABLE.
A common cause of this error is the presence of a configuration options 
object without the corresponding preset name. Example:

Invalid: { presets: [{option: value}] }
Valid: { presets: [['presetName', {option: value}]] }

and my addition is like

"development": {
    "VARIABLE": "value"
}

Any idea?

1 Answers
Related