Axios call not running in Gatsby onPostBuild

I’m trying to get some data from FB using a list of posts I build up earlier in the build process. When I have this code in gatsby-node.js:

exports.onPostBuild = () => {
  console.info(`console.log => 1`);
  const postSlugs = require('./content/post-slugs.json');
  const siteConfig = require('./gatsby-config');
  const siteUrl = siteConfig.siteMetadata.siteUrl.replace(//$/, '');
  console.info(`console.log => 2`);
  axios.get(`https://graph.facebook.com/v11.0/?id=${siteUrl}${postSlugs[0]}&access_token=xxxxxx&fields=engagement`)
      .then(res => {
        console.info(`console.log => 3`);
        console.log(JSON.stringify(res));
      })
      .catch(err => {
        console.info(`console.log => 4`);
        console.log(JSON.stringify(err));
      })
      .then(() => {
        console.info(`console.log => 5`);
      });

  console.info(`console.log => 6`);
};

The output I get is:

success Building production JavaScript and CSS bundles - 5.746s
success Building HTML renderer - 1.073s
success Building static HTML for pages - 0.532s - 79/79 148.37/s
info console.log => 1
info console.log => 2
info console.log => 6
success onPostBuild - 0.045s

Why are none of the promise callbacks getting called?

I’ve tried the raw node api as well as axios for this.

Answer

You need to wait for the function to finish, using async/await should work. Something like:

exports.onPostBuild = async () => {
  console.info(`console.log => 1`);
  const postSlugs = require('./content/post-slugs.json');
  const siteConfig = require('./gatsby-config');
  const siteUrl = siteConfig.siteMetadata.siteUrl.replace(//$/, '');
  console.info(`console.log => 2`);
  await axios.get(`https://graph.facebook.com/v11.0/?id=${siteUrl}${postSlugs[0]}&access_token=xxxxxx&fields=engagement`)
      .then(res => {
        console.info(`console.log => 3`);
        console.log(JSON.stringify(res));
      })
      .catch(err => {
        console.info(`console.log => 4`);
        console.log(JSON.stringify(err));
      })
      .then(() => {
        console.info(`console.log => 5`);
      });

  console.info(`console.log => 6`);
};

Now, you can even isolate the logic:

exports.onPostBuild = async () => {
  console.info(`console.log => 1`);
  const postSlugs = require('./content/post-slugs.json');
  const siteConfig = require('./gatsby-config');
  const siteUrl = siteConfig.siteMetadata.siteUrl.replace(//$/, '');
  console.info(`console.log => 2`);
  
 let data= await fetchData();

  console.info(`console.log => 6`);
};

async function fetchData(){
     await await axios.get(`https://graph.facebook.com/v11.0/?id=${siteUrl}${postSlugs[0]}&access_token=xxxxxx&fields=engagement`)
          .then(res => {
            console.info(`console.log => 3`);
            console.log(JSON.stringify(res));
          })
          .catch(err => {
            console.info(`console.log => 4`);
            console.log(JSON.stringify(err));
          })
          .then(() => {
            console.info(`console.log => 5`);
          });
}