# 安装

URL: https://caijiao.org/immer/guide/installation
Source: docs/immer/guide/installation.md
Description: 学习如何安装和配置 Immer 库，包括不同版本的选择和功能启用方法。

Immer 可以作为直接依赖项安装，并且可以在任何 ES5 环境中工作：

- Yarn: `yarn add immer`
- NPM: `npm install immer`
- CDN: 暴露的全局变量是 `immer`
  - Unpkg: `<script src="https://unpkg.com/immer"></script>`
  - JSDelivr: `<script src="https://cdn.jsdelivr.net/npm/immer"></script>`
  - ⚠️ 使用 CDN 时，最好检查浏览器中的 url 并查看它解析为哪个版本，这样当更新发布时，您的用户不会意外地获得更新的版本。因此，请改用如下网址：https://unpkg.com/immer@6.0.3/dist/immer.umd.production.min.js 。在 URL 中将 production.min 替换为 development 以进行开发构建。

## 选择您的 Immer 版本

_本节仅适用于版本 6 及更高版本_

为确保 Immer 尽可能小，并非每个项目都需要的功能已选择加入，并且必须明确启用。这可确保在将您的应用程序捆绑用于生产时，未使用的功能不会占用任何空间。

可以选择加入以下功能:

| 功能 | 描述 | 调用方法 |
| --- | --- | --- |
| ES 5 支持 | 如果您的应用程序需要能够在较旧的 JavaScript 环境（例如 Internet Explorer 或 React Native）上运行，请启用此功能。 | `enableES5()` |
| [ES2015 Map and Set 支持](./complex-objects) | 要使 Immer 能够对原生 Map 和 Set 集合进行操作，请启用此功能 | `enableMapSet()` |
| [JSON 补丁 支持](./patches) | Immer 可以跟踪您对 draft 对象所做的所有更改。这对于使用 JSON 补丁时传达更改很有用 | `enablePatches()` |

例如，如果您想在 `Map` 上使用 `produce` ，则需要在应用程序启动期间启用此功能一次：

```typescript
// 在你的应用程序入口文件
import {enableMapSet} from "immer"

enableMapSet()

// ...然后
import {produce} from "immer"

const usersById_v1 = new Map([
	["michel", {name: "Michel Weststrate", country: "NL"}]
])

const usersById_v2 = produce(usersById_v1, draft => {
	draft.get("michel").country = "UK"
})

expect(usersById_v1.get("michel").country).toBe("NL")
expect(usersById_v2.get("michel").country).toBe("UK")
```

Immer 以大约 3KB 的 gzip 压缩开始。每个启用的插件都会增加 < 1 KB。细分如下

```
Import size report for immer:
┌───────────────────────┬───────────┬────────────┬───────────┐
│        (index)        │ just this │ cumulative │ increment │
├───────────────────────┼───────────┼────────────┼───────────┤
│ import * from 'immer' │   5033    │     0      │     0     │
│        produce        │   3324    │    3324    │     0     │
│     enableMapSet      │   4030    │    4039    │    715    │
│     enablePatches     │   4112    │    4826    │    787    │
└───────────────────────┴───────────┴────────────┴───────────┘
(this report was generated by npmjs.com/package/import-size)
```

## Immer 使用在旧的 JavaScript 环境?

默认情况下，`produce` 尝试使用代理以获得最佳性能。但是，在较旧的 JavaScript 引擎上，代理不可用。例如，在 Android 上运行 Microsoft Internet Explorer 或 React Native（如果 React Native < v0.59 或在 React Native < v0.64 上使用 Hermes 引擎）时。在这种情况下，Immer 将回退到与 ES5 兼容的实现，其工作方式相同，但速度稍慢

- 从版本 6 开始，必须通过调用 `enableES5()` 显式启用对回退实现的支持
- Version 10 drops the fallback implementation fully, and cannot be used in browsers / engines that don't support Proxy.