Firebase v9调用createUserWithEmailAndPassword两类报错如何解决

错误原因 #

1. 你使用的是Firebase 9.x模块化版本，该版本不支持旧版auth.方法名的命名空间调用方式，所有鉴权方法都是独立导入使用，因此你调用auth.createUserWithEmailAndPassword时会提示该方法不存在。
2. 你删除auth.后触发的第二个错误，是因为createUserWithEmailAndPassword方法要求第一个参数必须传入初始化完成的auth实例，你直接把邮箱字符串作为第一个参数传入，参数类型不匹配触发了内部报错。

修正方案 #

修改两处代码即可：

1. 初始化auth和firestore时建议显式传入app实例，避免多项目实例场景下出错
2. 调用createUserWithEmailAndPassword时按要求传入参数

修正后的完整代码如下：

import { initializeApp } from 'https://www.gstatic.com/firebasejs/9.0.2/firebase-app.js';
import { getAuth, createUserWithEmailAndPassword } from 'https://www.gstatic.com/firebasejs/9.0.2/firebase-auth.js';
import { getFirestore } from "https://www.gstatic.com/firebasejs/9.0.2/firebase-firestore.js"

// 替换为你自己的Firebase项目配置
const firebaseConfig = {
    " my config here "
};

const app = initializeApp(firebaseConfig);
// 显式传入app实例
const auth = getAuth(app);
const db = getFirestore(app);

document.getElementById("button").addEventListener("click", function () {
    var email = document.getElementById("email").value;
    var phone = document.getElementById("phone").value;
    var password = document.getElementById("password").value;

    // 正确传参：第一个参数是auth实例，第二个是邮箱，第三个是密码
    createUserWithEmailAndPassword(auth, email, password).then(cred => {
        console.log(cred);
    })
});

内容的提问来源于stack exchange，提问作者Mohammed Rashid