Remove usage of process.env.NODE_ENV in ES module build

[keanulee]

Do you want to request a feature or report a bug?

Feature

What is the current behavior?

The ES module build of Redux references process.env.NODE_ENV which doesn't exist on browsers. With unpkg.com's ?module query param that converts package names to paths, this is the only issue blocking users from loading Redux as a module from the browser.

See references to process.env.NODE_ENV in:

• https://unpkg.com/redux@3.7.2/es/index.js?module
• https://unpkg.com/redux@4.0.0-beta.2/es/redux.js?module

What is the expected behavior?

No references to process.env.NODE_ENV in the ES module build.

Demo: http://jsbin.com/tazoliy/edit?html,output

[timdorr]

Note that React does this too.

This is important to prevent against the common mistake of including the development checks in a production build, as they significantly impact the speed of Redux. A workable solution would be to check for process's existence first. Can you make a PR for this?

[TimvdLippe]

I see that the corresponding PR has been closed for not being the appropriate solution, but this issue remains. Couls you reopen so we can discuss alternative solutions to resolve this?

[justinfagnani]

Agreed @TimvdLippe. That Redux modules don't work in the browser without intervention is frustrating. This disrupts otherwise very nice flows like using unpkg.com to serve modules to jsbin and friends.

[markerikson]

Looking at #2910 , it seems that the proposed PR didn't correctly result in the blocks being removed from prod builds. I don't have time to pursue this myself, but if someone can contribute a working solution, we can consider getting it in.

[markerikson]

(Note that the issue being "closed" certainly didn't stop people from being able to discuss this, but I'll re-open it as an indication that it's still a valid topic.)

[TimvdLippe]

EDIT: As the corresponding PR has been merged, please do not use the below method. Use the officially published Redux package instead

For anyone looking at a browser-compatible ES-module version, I have a PR open in #3143. However, until the Redux maintainers have decided whether or not to merge the PR, you can depend on https://github.com/TimvdLippe/redux/tree/es-browser-build to use the package. Add the following line to your package.json to get the correct version:

"dependencies": {
  "redux": "timvdlippe/redux.git#es-browser-build"
}

[rjcorwin]

@TimvdLippe Do you have any examples you can point to where this is used? I'm still getting process is not defined using react 4.0.1 and also the package you recommended.

[TimvdLippe]

@rjsteinert You have to point to the es/redux.mjs specifically. You can not just do import "redux" and let that work. E.g. this should work: import { createStore } from "redux/es/redux.mjs";

[rjcorwin]

@TimvdLippe That did the trick!

[stevesan]

So, I'm a new user to redux and trying to get it to work with rollup (also karma+jasmine) and I'm running into this multiple times. Is there a clean solution to this, or do we still need to do the replace-hack?

[ghost]

Hi!

Is using something like import { createStore } from "redux/es/redux.mjs"; still the recommended approach in browsers, and browser based test enivroments (e.g. Karma)?

[justinfagnani]

Having to import a separate module is not a great solution. Some libraries will do import { createStore } from 'redux/es/redux.mjs'; and others import { createStore } from 'redux';. If you have those both in an app you'll get duplication of the redux library.