使用 Firebase Cloud Functions 时未定义 httpsCallable

Question

过去一周我一直在尝试设置 Firebase Cloud Functions，但无法导入所需的依赖项。

这是在我的 script.js 文件中，我的主要代码：

import firebase from "firebase/app"
require("firebase/functions");

const testFunction = httpsCallable(functions, 'testFunction')

返回此错误：

script.js:7 Uncaught ReferenceError: httpsCallable is not defined
    at Object.parcelRequire.script.js.firebase/app (script.js:7)
    at newRequire (script.75da7f30.js:47)
    at script.75da7f30.js:81
    at script.75da7f30.js:120

在我的 index.html 中，我有这个：

    <script src="https://www.gstatic.com/firebasejs/8.6.5/firebase-app.js"></script>
    <script src="https://www.gstatic.com/firebasejs/8.6.5/firebase-auth.js"></script>
    <script src="https://www.gstatic.com/firebasejs/8.6.5/firebase-database.js"></script>
<script src="https://www.gstatic.com/firebasejs/8.10.0/firebase-functions.js"></script>
<script src="https://www.gstatic.com/firebasejs/8.10.0/firebase.js"></script>
    <script src="https://www.gstatic.com/firebasejs/8.6.5/firebase-analytics.js"></script>


<script>  
const firebaseConfig = {
    apiKey: "XXXXXXXXXXXX",
    authDomain: "XXXXX-XXXXX.firebaseapp.com",
    databaseURL: "https://XXXXX-XXXXX-default-rtdb.firebaseio.com",
    projectId: "XXXXX-XXXXX",
    storageBucket: "XXXXX-XXXXX.appspot.com",
    messagingSenderId: "XXXXXX",
    appId: "1:XXXXXX:web:XXXXXX"
  };
        // Initialize Firebase
        firebase.initializeApp(firebaseConfig);
        firebase.auth().setPersistence(firebase.auth.Auth.Persistence.LOCAL)
        firebase.analytics()
</script>

我错过了什么？

编辑：为了升级到新版本的 Firebase，我删除了我的 html 中的脚本引用，在我的项目文件夹中做了“npm i firebase@9.1.3”，将所有内容移到我的 script.js 文件中，这是现在的样子。但是我仍然得到 httpsCallable is not defined 错误，所以版本似乎没有影响它。

import firebase from "firebase/compat/app"
import 'firebase/compat/functions'
import 'firebase/compat/auth'
import 'firebase/compat/analytics'
import 'firebase/compat/database'

const firebaseConfig = {
    apiKey: "XXXXXXXXXXXX",
    authDomain: "XXXXX-XXXXX.firebaseapp.com",
    databaseURL: "https://XXXXX-XXXXX-default-rtdb.firebaseio.com",
    projectId: "XXXXX-XXXXX",
    storageBucket: "XXXXX-XXXXX.appspot.com",
    messagingSenderId: "XXXXXX",
    appId: "1:XXXXXX:web:XXXXXX"
  };
// Initialize Firebase
firebase.initializeApp(firebaseConfig);
firebase.auth().setPersistence(firebase.auth.Auth.Persistence.LOCAL)
firebase.analytics()

Answer 1

当使用旧的命名空间语法（

import firebase from "firebase/compat/app" // just firebase/app in <v8
import 'firebase/compat/functions'         // just firebase/functions in <v8

const testFunction = firebase.functions().httpsCallable('testFunction')

testFunction({ /* data */ })
  .then((result) => { /* ... */ })
  .catch((err) => { /* ... */ })

对于现代模块化语法 (v9+)，使用：

import { getFunctions, httpsCallable } from 'firebase/functions'

const testFunction = httpsCallable(getFunctions(), 'testFunction')

testFunction({ /* data */ })
  .then((result) => { /* ... */ })
  .catch((err) => { /* ... */ })

这些是documented here。