javascript - Nâng cấp lên Firebase JS 8.0.0: Lỗi khi thử nhập: 'app' không được xuất khẩu từ 'firebase/app' (được nhập dưới dạng 'firebase')

Sau khi nâng cấp lên 8.0.0, tôi nhận được lỗi sau:

Lỗi nhập khẩu thử: 'initializeApp' không được xuất khẩu từ 'firebase/app' (được nhập khẩu dưới dạng 'firebase').

Nhập khẩu của tôi trông như thế này:

import * as firebase from "firebase/app"
firebase.initializeApp({ ... })

TypeScript cũng cảnh báo:

Thuộc tính 'initializeApp' không tồn tại trên kiểu 'typeof import("/path/to/my/file")'. ts(2339)

Làm thế nào để tôi sửa điều này?

Câu trả lời #1

Trong phiên bản 8.0.0, SDK Firebase đã có một thay đổi đột phá trong cách nó xử lý các xuất:

Thay đổi quan trọng: các trường browser trong các tệp package.json hiện trỏ đến các gói ESM thay vì các gói CJS. Người dùng đang sử dụng các nhập khẩu ESM bây giờ phải sử dụng nhập khẩu mặc định thay vì nhập khẩu không gian tên.

Trước 8.0.0

import * as firebase from 'firebase/app'

Sau 8.0.0

import firebase from 'firebase/app'

Mã sử dụng require('firebase/app') hoặc require('firebase') vẫn sẽ hoạt động, nhưng để có kiểu dữ liệu chính xác (ví dụ cho tự động hoàn thành mã), người dùng nên thay đổi các lệnh require này thành require('firebase/app').default hoặc require('firebase').default. Điều này là vì SDK hiện nay sử dụng kiểu dữ liệu cho gói ESM, và các gói khác nhau chia sẻ một tệp kiểu dữ liệu duy nhất.

Vì vậy, bạn sẽ phải sử dụng xuất khẩu mặc định của gói ESM mới:

import firebase from "firebase/app"
firebase.initializeApp({ ... })

Nếu bạn đang làm việc với phiên bản SDK 9.0, hãy đọc câu hỏi này thay vào đó:

• Làm thế nào để tôi sửa lỗi nhập Firebase 9.0? "Lỗi nhập đã cố gắng: 'firebase/app' không chứa xuất mặc định (được nhập dưới dạng 'firebase')."

Câu trả lời #2

cách cũ để nhập firebase: import * as firebase from "firebase/app";

Cách mới để nhập khẩu trong phiên bản 8.0.0: import firebase từ "firebase/app"

ví dụ: cách tôi đã làm. Chỉ có 2 dòng đầu tiên là liên quan, các dòng khác chỉ được thêm vào như một phần của mã của tôi nhưng thực ra khá chung chung!

import firebase from "firebase/app"
import "firebase/auth"

const firebaseConfig = {
  apiKey: XXXX,
  authDomain: XXX,
  projectId: XXXX,
  storageBucket: XXXX,
  messagingSenderId: XXXX,
  appId: XXXX,
}


if (!firebase.apps.length) {
  firebase.initializeApp(firebaseConfig)
}


export const auth = firebase.auth() 
export const googleAuthProvider = new firebase.auth.GoogleAuthProvider()

thay XXXX bằng dữ liệu của bạn, chỉ để rõ ràng :)