This is an alpha release for React-Redux 9.0. This release has many changes to our build setup and published package contents, and has breaking changes.
npm i react-redux@alpha
yarn add react-redux@alphaThis is part of the next set of major versions for all of the Redux packages, including:
Please try out this alpha and give us feedback on how it works!
Changelog
React 18 and Redux 5 Are Required
React-Redux 7.x and 8.x worked with all versions of React that had hooks (16.8+, 17.x, 18.x). However, React-Redux v8 used React 18's new useSyncExternalStore hook. In order to maintain backwards compatibility with older React versions, we used the use-sync-external-store "shim" package that provided an official userland implementation of the useSyncExternalStore hook when used with React 16 or 17. This meant that if you were using React 18, there were a few hundred extra bytes of shim code being imported even though it wasn't needed.
For React-Redux v9, we're switching so that React 18 is now required! This both simplifies the maintenance burden on our side (fewer versions of React to test against), and also lets us drop the extra bytes because we can import useSyncExternalStore directly.
React 18 has been out for a year and a half, and other libraries like React Query are also switching to require React 18 in their next major version. This seems like a reasonable time to make that switch.
Similarly, React-Redux now depends on Redux core v5 for updated TS types (but not runtime behavior).
ESM/CJS Package Compatibility
The biggest theme of the Redux v5 and RTK 2.0 releases is trying to get "true" ESM package publishing compatibility in place, while still supporting CJS in the published package. We've now applied those same packaging changes to React-Redux.
We've set up a battery of example applications in the RTK repo that use a variety of build tools (currently CRA4, CRA5, Next 13, and Vite, Node CJS mode, and Node ESM mode), to verify that Redux and Redux Toolkit compile, import, and run correctly with both TS and various bundlers. We're also using the CLI from https://arethetypeswrong.github.io to check for potential packaging incompatibilities.
This release changes the names and contents of the published build artifacts, and the various exports/module/main fields in package.json to point to those.
The primary build artifact is now an ESM file, dist/react-redux.mjs. Most build tools should pick this up. There's also a CJS artifact, and a second copy of the ESM file named react-redux.legacy-esm.js to support Webpack 4 (which does not recognize the exports field in package.json).
As of this release, we think we have ESM+CJS compat working correctly, but we ask that the community try out the alphas in your apps and let us know of any compat problems!
Note: The one known potential issue is that TypeScript's new
moduleResolution: "node16"mode may see a mismatch between the ESM artifacts and the TS typedefs when imported in a Node CJS environment, and that may allow hypothetically-incorrect import usage. (See ongoing discussion in arethetypeswrong/arethetypeswrong.github.io#21 .) In practice, we think that probably won't be a concern, and we'll do further investigation before a final release.
Build Tooling
We're now building the package using https://github.com/egoist/tsup . It looks like the output is effectively equivalent, but please let us know if there's any issues.
We also now include sourcemaps for the ESM and CJS artifacts.
Dropping UMD Builds
The Redux packages have always shipped with UMD build artifacts. These are primarily meant for direct import as script tags, such as in a CodePen or a no-bundler build environment.
For now, we're dropping those build artifacts from the published package, on the grounds that the use cases seem pretty rare today.
We do have a browser-ready ESM build artifact included at dist/react-redux.browser.mjs, which can be loaded via a script tag that points to that file on Unpkg.
If you have strong use cases for us continuing to include UMD build artifacts, please let us know!
React Server Component Compatibility
For this initial alpha, we've marked the React-Redux bundles with the "use client" label. This at least seems to let an example Next.js app build even if it imports useSelector into an RSC page file, but to be honest we're still figuring this stuff out! Expect further changes before a final release.
TypeScript Updates
React-Redux now depends on the updated TS types from Redux core v5. This mostly involves uses of UnknownAction everywhere instead of AnyAction.
What's Changed
- Update packaging, build config, and entry points for v9 by @markerikson in #2038
Full Changelog: v8.1.2...v9.0.0-alpha.0