安装
Redux Toolkit
Redux Toolkit 包含 Redux 核心,以及我们认为构建 Redux 应用程序必不可少的其他关键包(例如 Redux Thunk 和 Reselect)。
它作为 NPM 上的包提供,可用于模块打包器或 Node 应用程序。
# NPM
npm install @reduxjs/toolkit
# Yarn
yarn add @reduxjs/toolkit
该包包含一个预编译的 ESM 构建,可以直接在浏览器中用作 <script type="module">
标签。
补充包
React-Redux
最有可能的是,您还需要 与 React 一起使用的 react-redux
绑定
npm install react-redux
请注意,与 Redux 本身不同,Redux 生态系统中的许多包不提供 UMD 构建,因此我们建议使用模块打包器,例如 Vite 和 Webpack,以获得最舒适的开发体验。
Redux DevTools 扩展
Redux Toolkit 的 configureStore
自动设置与 Redux DevTools 的集成。您需要安装浏览器扩展程序以查看存储状态和操作。
- Redux DevTools 扩展
如果您使用的是 React,您还需要 React DevTools 扩展。
- React DevTools 扩展
创建 React Redux 应用程序
使用 React 和 Redux 启动新应用程序的推荐方法是使用 我们官方的 Redux+TS 模板(适用于 Vite),或者使用 Next 的 with-redux
模板 创建一个新的 Next.js 项目。
这两个模板都已为该构建工具适当地配置了 Redux Toolkit 和 React-Redux,并且附带了一个小型示例应用程序,演示了如何使用 Redux Toolkit 的几个功能。
# Vite with our Redux+TS template
# (using the `degit` tool to clone and extract the template)
npx degit reduxjs/redux-templates/packages/vite-template-redux my-app
# Next.js using the `with-redux` template
npx create-next-app --example with-redux my-app
我们目前没有官方的 React Native 模板,但建议使用以下模板来创建标准 React Native 和 Expo 应用程序。
- https://github.com/rahsheen/react-native-template-redux-typescript
- https://github.com/rahsheen/expo-template-redux-typescript
Redux 核心
要单独安装 redux
核心包,请执行以下操作:
# NPM
npm install redux
# Yarn
yarn add redux
如果您没有使用打包器,您可以 在 unpkg 上访问这些文件、下载它们或将您的包管理器指向它们。