将js导入Vue项目

时间:2020-07-27 22:43:36

标签: javascript firebase vue.js es6-modules vuefire

我正在考虑使用Vuefire简化Firestore与我的Vue项目的集成。在阅读getting started documentation时,他们让您创建db.js文件,以便您可以“方便地”将其导入项目中的任何地方。

import firebase from 'firebase/app'
import 'firebase/firestore'

// Get a Firestore instance
export const db = firebase
  .initializeApp({ projectId: 'MY PROJECT ID' })
  .firestore()

// Export types that exists in Firestore
// This is not always necessary, but it's used in other examples
const { Timestamp, GeoPoint } = firebase.firestore
export { Timestamp, GeoPoint }

// if using Firebase JS SDK < 5.8.0
db.settings({ timestampsInSnapshots: true })

Binding page的下一步中,它们显示您可以将该模块导入“ RecentDocuments”组件

// RecentDocuments.vue
import { db } from './db'

export default {
  data() {
    return {
      documents: [],
    }
  },

  firestore: {
    documents: db.collection('documents'),
  },
}

如果我将同一个db.js文件导入另一个组件,它将不会创建Firebase Firestore对象的另一个实例,因为它基本上是再次调用.initializeApp?

// SomeOtherComponent.vue
import { db } from './db'

export default {
  ...

还是我不了解导入的工作原理?

1 个答案:

答案 0 :(得分:0)

不,不会。导入仅发生一次。每个进口的出口实际上是单身人士。您只需通过将日志消息添加到导入中就可以验证这一点。