Can't Figure Out How to Use Gridsome-Plugin-Firestore

Question

I am trying to use the gridsome-plugin-firestore plugin (https://gridsome.org/plugins/gridsome-source-firestore). I want to use that plugin to connect to a simple firestore database collection called news. News has a number of documents with various fields:

• content
• published_date
• summary
• author
• title
• etc.

Does anyone know how am I supposed to set up the gridsome.config file to access this collection using the gridsome-plugin-firestore plugin?. I cannot figure it out from the instructions given.

Answer 1

The Gridsome docs are a little clearer than npm version, but you need to generate a Firebase Admin SDK private key and download the whole file to your Gridsome app and import it into gridsome.config.js as a module, name it whatever you want for the options > credentials: require field as below.

First, you'll need the Firestore plugin

$ yarn add gridsome-source-firestore

Then in gridsome.config.js

const { db } = require('gridsome-source-firestore')

module.exports = {
  plugins: [
    {
      use: 'gridsome-source-firestore',
      options: {
        credentials: require('./my-project-firebase-adminsdk-qw2123.json'), // 
        Replace with your credentials file you downloaded.
        debug: true, // Default false, should be true to enable live data updates
        ignoreImages: false, // Default false
        imageDirectory: 'fg_images', // Default /fg_images
        collections: [
          {
            ref: (db) => {
              return db.collection('news')
            },
            slug: (doc, slugify) => {
              return `/news/${slugify(doc.data.title)}`
            },
            children: [
              {
                ref: (db, parentDoc) => {
                  return parentDoc.ref.collection('posts')
                },
                slug: (doc, slugify) => {
                  return `/${slugify(doc.data.title)}`
                },
              }
            ]
          }
        ]
      }
    }
  ]
}

You might have to change "posts" to "content" depending on your DB structure and alter the corresponding page queries to suit, there are some examples and other useful setup info in this Gridsome Firestore starter on Github https://github.com/u12206050/gridsome-firestore-starter.git