用户的 Firebase v8 Typescript 定义导入

Posted 2023-02-22

【中文标题】用户的 Firebase v8 Typescript 定义导入

【英文标题】：Firebase v8 Typescript definition import for User

【发布时间】：2021-02-10 03:43:49

【问题描述】：

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

import User from 'firebase';

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

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

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

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

【参考方案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