使用 @nuxtjs/firebase 在 Nuxt 中使用 Cloud Firestore 生成动态路由答案

【问题标题】：Generating dynamic routes in Nuxt with Cloud Firestore using @nuxtjs/firebase使用 @nuxtjs/firebase 在 Nuxt 中使用 Cloud Firestore 生成动态路由
【发布时间】：2023-03-10 11:23:01
【问题描述】：

我需要一些帮助。

我正在尝试在 Nuxt 上构建我的静态站点，该站点有一堆动态路由。

到目前为止，在我的 nuxt.config.js 中，我已经有了

generate: {
   async routes() {
   const queryDb = await app.$fire.firestore.collection("schools").get()
   return queryDb.docs.map(x => `/performance/${x.schoolId}`);
  }
}

但是，当使用 Nuxt generate 时，它会失败，因为它无法读取属性“$fire”，这就是我在整个应用程序中访问 firebase 的方式（使用 https://firebase.nuxtjs.org）。在创建路线之前有什么方法可以要求它吗？任何帮助，将不胜感激！谢谢。

【问题讨论】：

标签： firebase vue.js google-cloud-firestore nuxt.js dynamic-routing

【解决方案1】：

我也遇到了错误：

TypeError: 无法读取未定义的属性“$fire”

在关注此demo of Nuxt and Firebase 后，通过在buildModules 中添加'@nuxtjs/firebase' 进行修复，tutorial 中未提及：

nuxt.config.js

buildModules: [
    '@nuxtjs/firebase'
],

【讨论】：

如果您对我的回答有任何澄清或疑问，请告诉我。如果您发现我的回答中的信息有帮助，您可以接受或投票。