我已经决定将我的项目转换为使用Webpack，因为它变得非常混乱，并且我正在努力为应用程序的每个部分（成员，计划，认证等）使用Firebase以某种方式（函数，数据库，认证等）创建多个js文件。似乎所有东西都需要在index.js中才能工作。
我总是得到一个（不同的）奇怪的错误，涉及到Firebase不能从index.js文件访问。
我该如何构建它，以便我可以在多个文件中使用Firebase，然后在最后与Webpack捆绑在一起？
这是我的资料

index.js

import $ from 'jquery';
import mixpanel from 'mixpanel-browser';

import { initializeApp } from "firebase/app";
import { getAnalytics } from "firebase/analytics";
import { getFirestore, collection, query, where, getDocs } from "firebase/firestore";
import { getAuth, createUserWithEmailAndPassword, signInWithEmailAndPassword, onAuthStateChanged } from "firebase/auth";

const firebaseConfig = {
  ...
};

// Initialize Firebase
const app = initializeApp(firebaseConfig);
const db = getFirestore(app);
const analytics = getAnalytics();

const auth = getAuth();

// Javascript
import './js/auth.js';
import './js/members.js';

// Styles
import './scss/fonts.scss';
import './scss/auth.scss';
import './scss/main.scss';
import './scss/navbar.scss';
import './scss/buttons.scss';
import './scss/inputs.scss';
...

members.js

import { getFunctions, httpsCallable } from "firebase/functions";

const functions = getFunctions();
const listMembers = httpsCallable(functions, 'listMembers');
listMembers()
  .then((result) => {
    const data = result.data;
    const sanitizedMessage = data.text;
    console.log(sanitizedMessage);
  })
  .catch((error) => {
    const code = error.code;
    const message = error.message;
    const details = error.details;
  });