用户的 Firebase v8 Typescript 定义导入答案

【问题标题】：Firebase v8 Typescript definition import for User用户的 Firebase v8 Typescript 定义导入
【发布时间】：2021-02-10 03:43:49
【问题描述】：

我使用以前版本的 Firebase 导入 User 的 Typescript 定义，如下所示：

import {User} from 'firebase';

随着 v8 的引入，此导入不再起作用：

模块 '"../../../../node_modules/firebase"' 没有导出的成员 'User'。您的意思是改用“从“../../../../node_modules/firebase”导入用户吗？

release notes 指出了 CJS 捆绑包已被删除的事实，但并未提及现在应该如何解决此导入问题。

任何帮助表示赞赏，在此先感谢您。

【问题讨论】：

标签： typescript firebase

【解决方案1】：

你可以这样说：

import firebase from "firebase/app"
const user: firebase.User = ...

或者如果你想缩写它：

import firebase from "firebase/app"
type User = firebase.User
const user: User = ...

【讨论】：

您好，Doug，谢谢您的回答。这也是我的猜测，但它会导致 TS2694: Namespace '"...node_modules/firebase/index"' has no exported member 'User'. 错误。
我根本没有得到那个错误。我实际上尝试了您在此处看到的代码。
奇怪?。同时我想我找到了解决办法。我可以导入如下定义：import {User} from '@firebase/auth-types';

【解决方案2】：

在使用 Firebase JS SDK v8.0.0 导入 User 时，我能够解决我的问题，如下所示：

import {User} from '@firebase/auth-types';

【讨论】：

documentation 表明您不应该直接使用它。这是将来可能会打破的东西。
很高兴知道。请注意，我没有明确引用 lib，它与官方支持的包一起提供。
直接从它导入，被认为是直接使用。主要模块可以随时更改，并像这样删除或更改其“私有”依赖项。

【解决方案3】：

对于 V9.0.0（Web 版本 9（模块化），这可以通过

// make alias for greater readability
import { User as FirebaseUser } from "firebase/auth";

然后您可以通过以下方式使用它：

// here direct use the type inside a hooks 
const [user, setUser] = useState<FirebaseUser | null>(null)

【讨论】：

【解决方案4】：

您是否尝试过导入 firebase，然后使用 firebase.User 访问用户？它显然更厚实，但对我有用。

编辑：我之前也遇到过导入冲突的问题——我有一个名为 firebase.ts 的文件，导致我的应用程序缩小。只是提到它以防你偶然有类似的东西

【讨论】：

感谢您的建议。确实我试过了，但没有成功，有点奇怪。
Ahh :/ 你使用的是 firebase 8.0 对吗？您介意粘贴您在上面尝试过的代码吗？
是的 Firebase v8，我完全按照你的建议做了 (import firebase from '@firebase/app'; + const user: firebase.User;)。
感谢您的编辑，没有找到任何此类文件，但是是的，这是一个有效的观点，也许/可能在我的项目中有些奇怪。如果对应用程序“工作室”中的github.com/deckgo/deckdeckgo 感兴趣。可以在auth.service.tsx中试一试。
我注意到我收到了控制台警告，因为我在上面的操作方式。当我以另一种方式进行操作时，该警告消失了。 “从‘firebase/app’导入firebase；”然后是“firebase.User”来指代用户界面。

【解决方案5】：

importing firebase 的另一种替代方法是在 index.d.ts 文件中添加 firebase 类型：

/// <reference types="firebase" />

type Firebase = typeof firebase.default

type FirebaseApp = firebase.default.app.App

type FirebaseUser = firebase.default.User

注意：我必须使用firebase.default 而不是firebase，因为我使用的是三斜杠指令/// <reference types="..." />

您可以通过在 index.d.ts 文件中导入 firebase 来省略 .default：

import firebase from "firebase/app"

type Firebase = typeof firebase

type FirebaseApp = firebase.app.App

type FirebaseUser = firebase.User

【讨论】：