Skip to main content

安装

¥Installation

Redux 工具包​

¥Redux Toolkit

Redux Toolkit 包括 Redux 核心，以及我们认为构建 Redux 应用必不可少的其他关键包（例如 Redux Thunk 和 Reselect）。

¥Redux Toolkit includes the Redux core, as well as other key packages we feel are essential for building Redux applications (such as Redux Thunk and Reselect).

它可以作为 NPM 上的包与模块打包器或 Node 应用一起使用：

¥It's available as a package on NPM for use with a module bundler or in a Node application:

# NPM
npm install @reduxjs/toolkit

# Yarn
yarn add @reduxjs/toolkit

该软件包包含预编译的 ESM 版本，可以直接在浏览器中用作 <script type="module"> 标签。

¥The package includes a precompiled ESM build that can be used as a <script type="module"> tag directly in the browser.

配套包​

¥Complementary Packages

React-Redux​

你很可能还需要 用于 React 的 react-redux 绑定

¥Most likely, you'll also need the react-redux bindings for use with React

npm install react-redux

请注意，与 Redux 本身不同，Redux 生态系统中的许多软件包不提供 UMD 构建，因此我们建议使用 Vite 和 Webpack 等模块打包器以获得最舒适的开发体验。

¥Note that unlike Redux itself, many packages in the Redux ecosystem don't provide UMD builds, so we recommend using module bundlers like Vite and Webpack for the most comfortable development experience.

Redux DevTools 扩展​

¥Redux DevTools Extension

Redux Toolkit 的 configureStore 自动设置与 Redux 开发工具 的集成。你需要安装浏览器扩展来查看存储状态和操作：

¥Redux Toolkit's configureStore automatically sets up integration with the Redux DevTools. You'll want to install the browser extensions to view the store state and actions:

如果你使用 React，你还需要 React DevTools 扩展：

¥If you're using React, you'll want the React DevTools extension as well:

创建 React Redux 应用​

¥Create a React Redux App

使用 React 和 Redux 启动新应用的推荐方法是使用 我们的 Vite 官方 Redux+TS 模板，或使用 Next 的 with-redux 模板 创建新的 Next.js 项目。

¥The recommended way to start new apps with React and Redux is by using our official Redux+TS template for Vite, or by creating a new Next.js project using Next's with-redux template.

这两个工具都已经为该构建工具适当配置了 Redux Toolkit 和 React-Redux，并附带了一个小示例应用，演示如何使用 Redux Toolkit 的多个功能。

¥Both of these already have Redux Toolkit and React-Redux configured appropriately for that build tool, and come with a small example app that demonstrates how to use several of Redux Toolkit's features.

# 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：

¥We do not currently have official React Native templates, but recommend these templates for standard React Native and for Expo:

Redux 核心​

¥Redux Core

自行安装 redux 核心包：

¥To install the redux core package by itself:

# NPM
npm install redux

# Yarn
yarn add redux

如果你不使用打包程序，则可以 访问 unpkg 上的这些文件、下载它们或将包管理器指向它们。

¥If you're not using a bundler, you can access these files on unpkg, download them, or point your package manager to them.