Невозможно добавить FireBase в компонент в Vue js

Question

Я изучаю vue. js (версия 4.3.1) из документации учебник по inte rnet, сейчас я пытаюсь интегрировать Vue js с Firebase ("firebase") : "^ 7.14.0",), но когда я запускаю его, появляется ошибка:

база данных не определена

Однако я делаю это за один раз файл называется firebase. js, но когда я добавляю импорт в компоненты, он выдает эту ошибку.

//firebase.js
// Your web app's Firebase configuration
  var firebaseConfig = {
    apiKey: "********",
    authDomain: "**********",
    databaseURL: "*********",
    projectId: "*********",
    storageBucket: "******",
    messagingSenderId: "******",
    appId: "*******",
    measurementId: "******"
  };
  // Initialize Firebase
  firebase.initializeApp(firebaseConfig);
  firebase.analytics();

`

`

//login.vue
import firebase from "../firebase"

Answer 1

Вы ничего не экспортируете в firebase.js. Поэтому, когда вы делаете import firebase from "../firebase" в нашем login.vue, код импортируется, но firebase не получает никакого значения. Это приводит к появлению сообщения об ошибке при попытке доступа к firebase в вашем коде.

Решение состоит в том, чтобы экспортировать переменные из firebase.js, которые вы хотите использовать в остальной части вашего приложения. Как показано в ссылке на Github, предоставленной Renaud, вы можете сделать это, например:

//firebase.js
// Your web app's Firebase configuration
  var firebaseConfig = {
     ...
  };
  // Initialize Firebase
  firebase.initializeApp(firebaseConfig);
  firebase.analytics();
  export {
    analytics: firebase.analytics(),
    auth: firebase.auth()
  }

Или, мои личные предпочтения:

//firebase.js
// Your web app's Firebase configuration
  var firebaseConfig = {
     ...
  };
  // Initialize Firebase
  firebase.initializeApp(firebaseConfig);
  firebase.analytics();
  export default firebase;