how to import data to gatbsy-config.js

Question

I would like to add data to gatbsy-config in order to use GraphQL to manage the data.

so I copied the gatbsy-config.js :

module.exports = {
  siteMetadata: {
    title: `Gatsby Default Starter`,
    description: `Kick off your next, great Gatsby project with this default starter. This barebones starter ships with the main Gatsby configuration files you might need.`,
    author: `@gatsbyjs`,
  },
}

and I replaced the siteMetadata with my data, and all work fine.

But I would like to use an json, or any file to store the data, and not put in the config directly, so I tried :

import data fron 'src/data/myData.json'

module.exports = {
  siteMetadata: {
    data: data
  },
}

but I get an error on the first like

import projects from 'src/data/myData.json';
                                                                       ^^^^^^^^
  SyntaxError: Unexpected identifier

So it looks like I can't use import. Is there a way to achieve this ?

https://stackoverflow.com/a/36326307/5385381 – ksav Feb 23 '20 at 04:52 — ksav, Feb 23 '20 at 04:52

score 2 · Answer 1 · answered Feb 26 '20 at 15:56

Suppose your data file's directory is src/data/.

Let's say your data file is config.js and it includes

const config = {
    title: `Gatsby Default Starter`,
    description: `Kick off your next, great Gatsby project with this default starter. This barebones starter ships with the main Gatsby configuration files you might need.`,
    author: `@gatsbyjs`
}

module.exports = config;

Then in your gatsby-config.js file you can import this file like below:

const config = require('./src/data/config');

module.exports = {
  siteMetadata: {
    title: config.title,
    description: config.description,
    author: config.author
  },

}

how to import data to gatbsy-config.js

1 Answers1