此页面由 Cloud Translation API 翻译。

升级到模块化 Web SDK (v9)

如果应用目前正在使用 Web SDK 8 或更低版本，应考虑按照本指南中的说明迁移到版本 9。

本指南假定您熟悉版本 8，并且会学习充分利用模块打包器（例如 webpack 或用于升级和持续开发 v9 的汇总信息。

强烈建议在开发环境中使用模块打包器。如果不使用，您将无法使用版本 9 的主要在缩减应用大小方面的优势您需要使用 npm 或 yarn 安装 SDK。

兼容型库简介

Web SDK 版本 9 提供了两种类型的库：

模块化 - 用于实现摇树优化的新 API 接口（移除未使用的代码），以尽可能缩减您的 Web 应用的大小和运行速度。
Compat - 一种熟悉的 API 接口，与版本 8，可让您升级到版本 9，而无需更改 SDK 代码兼容库的大小非常小，甚至没有，在性能方面的优势。

本指南假定您将利用 v9 兼容型库来推动升级。借助这些库使用版本 8 的代码和针对版本 9 重构的代码。这意味着您可以在升级过程中更轻松地编译和调试应用过程。

对于接触 Web SDK 很少的应用，重构了版本 8 代码，而无需使用版本 9 兼容型库。如果您升级此类应用，则可按照本指南中的说明 "版本 9 模块化"而无需使用兼容型库

升级流程简介

升级流程的每个步骤都限定了范围，这样您便可以完成应用源代码的修改，然后在不出现中断的情况下编译并运行源代码。总的来说，如需升级应用，您需要执行以下操作：

将 v9 库和兼容型库添加到您的应用中。
将代码中的 import 语句更新为使用 v9 兼容型库。
将代码重构为模块化样式。
移除用于身份验证的兼容型库和兼容型代码通过身份验证来实现应用大小方面的优势。
将初始化代码更新为模块化样式。
移除应用中所有剩余的 v9 兼容型语句和代码。

获取 v9 SDK

首先，使用 npm 获取版本 9 库和兼容型库（最新版本 https://www.npmjs.com/package/firebase):

npm i firebase@10.13.1

# OR

yarn add firebase@10.13.1

将导入项更新为 v9 兼容型库

将依赖项从 v8 更新为将导入语句更改为使用“兼容型”每次导入的内容。例如：

之前：v8

import firebase from 'firebase/app';
import 'firebase/auth';
import 'firebase/firestore';

之后：v9 兼容型库

// v9 compat packages are API compatible with v8 code
import firebase from 'firebase/compat/app';
import 'firebase/compat/auth';
import 'firebase/compat/firestore';

重构为模块化样式

v8 对应的 API 基于点链命名空间和服务模式，而 v9 模块化方法意味着您的代码将主要围绕函数进行组织。在版本 9 中，firebase/app 软件包和其他软件包不会返回包含所有方法。而是会导出个别函数。

在版本 9 中，服务作为第一个参数传递，函数随后系统将使用服务的详细信息执行其余操作

示例：重构简单的 Authentication 函数

之前：v9 兼容型库

版本 9 兼容型代码与版本 8 代码完全相同，但导入都发生了哪些变化在升级过程中使用兼容型库可让您继续使用版本 8 对应的代码以及针对版本 9 重构的代码。

import firebase from "firebase/compat/app";
import "firebase/compat/auth";

const auth = firebase.auth();
auth.onAuthStateChanged(user => {
  // Check for user status
});

之后：v9 模块化库

getAuth 函数将 firebaseApp 作为其第一个参数。onAuthStateChanged 函数不会像在 v8 中那样需要从 auth 实例串联；而是会成为一个自由函数，将 auth 作为其第一个参数。

import { getAuth, onAuthStateChanged } from "firebase/auth";

const auth = getAuth(firebaseApp);
onAuthStateChanged(auth, user => {
  // Check for user status
});

更新初始化代码

更新应用的初始化代码，使用新的模块化 v9 语法。重构应用中的所有代码后，请务必更新初始化代码；这是因为 firebase.initializeApp() 会初始化兼容型和模块化 API 的全局状态，而模块化 initializeApp() 函数仅会初始化模块化 API 的状态。

之前：v9 兼容型库

import firebase from "firebase/compat/app"

firebase.initializeApp({ /* config */ });

之后：v9 模块化库

import { initializeApp } from "firebase/app"

const firebaseApp = initializeApp({ /* config */ });

移除兼容型代码

为了使用 v9 模块化 SDK 精简应用大小，您最终应将所有调用转换为上述的模块化样式，并从代码中移除所有 import "firebase/compat/* 语句。完成后，代码中不应再包含对 firebase.* 全局命名空间的引用或版本 8 SDK 样式中任何其他代码的引用。

版本 9 的好处和限制

与早期版本相比，完全模块化的 v9 具有以下优势：

版本 9 可大幅缩减应用大小。它采用新型 JavaScript 模块格式，支持“摇树(优化)优化”做法只需导入应用需要的工件即可与使用 v8 构建的类似应用相比，使用 v9 进行摇树优化可使大小（以 Kb 为单位）减少 80%，具体取决于您的应用。
v9 将继续受益于后续的功能开发，而版本 8 则会在未来某一时间冻结。