Vueについて学び始めたばかりの初心者です。
FireBaseとの連携について学んでいるところなのですが、教材の通りに進めるとエラーが出てしまうので、よろしければご教授下さい

srcフォルダにfirbase/firebase.js　というフォルダとファイルを作成

// Import the functions you need from the SDKs you need
import { initializeApp } from "firebase/app";
import { getFirestore } from "firebase/firestore";
import 'firebase/auth';
import "firebase/storage";

// TODO: Add SDKs for Firebase products that you want to use
// https://firebase.google.com/docs/web/setup#available-libraries

// Your web app's Firebase configuration
const firebaseConfig = {
apiKey: ""
authDomain: "",
projectId: "",
storageBucket: "",
messagingSenderId: "",
appId: "",
};
// Initialize Firebase
const app = initializeApp(firebaseConfig);
// Initialize Cloud Firestore and get a reference to the service
const db = getFirestore(app);

export default db;

これを掲示板の画面を作成しているChatBorad.vueにて、

<

script>
import firebase from "../firebase/firebase.js"

export default {
created(){
const chatRef = firebase.firestore().collection('ChatData')
console.log(chatRef)
},
(以下略)

として画面遷移時に読み込みを行いたいのですが、実行すると
【_firebase_firebase_js__WEBPACK_IMPORTED_MODULE_0__.default.firestore is not a function】
としてエラーになってしまいます。

お分かりになる方、よろしければご教授お願い致します。