I'm new in GraphiQl, I'm flowing tutorials from here
And also I'm new to Gatsby, after all requirement plugin install (guide from gatsby offical doc) when I want to go on this link: http://localhost:8000/___graphql
then show me an error on allMdx
if I hover on it.
but official document everything is ok, I don't know where is my problem.
any update issue!
I have used gatsby v3
also my initial query not match with this
Any suggestion please.
Basically, the GraphQL playground (localhost:8000/___graphql
) is telling you that you have no allMdx
node created. The list of all available nodes are in the left column (allFile
, allDirectory
, etc).
You need to set the filesystem to allow Gatsby to inferr that nodes by:
npm install gatsby-source-filesystem
Then, in your gatsby-config.js
:
module.exports = {
siteMetadata: {
title: "My First Gatsby Site",
},
plugins: [
"gatsby-plugin-gatsby-cloud",
"gatsby-plugin-image",
"gatsby-plugin-sharp",
{
resolve: "gatsby-source-filesystem",
options: {
name: `blog`,
path: `${__dirname}/blog`, // <-- the folder where you have the .mdx files
}
},
],
};
If you have some MDX files in /blog
folder, Gatsby will generate the proper nodes (allMdx
), allowing you to query them.
Restart and clean your server by gatsby clean && gatsby develop
.
The next steps are related to query the data by adding some configuration such as:
{
resolve: `gatsby-plugin-mdx`,
options: {
defaultLayouts: {
posts: require.resolve("./src/components/blog-layout.js"),
default: require.resolve("./src/components/layout.js"),
},
},
},
Note: you'll need to install the gatsby-plugin-mdx
plugin first
You can check the following tutorial: https://www.digitalocean.com/community/tutorials/gatsbyjs-mdx-in-gatsby
Remember to clean cache (gatsby clean
) in each trial and to stop and re-run de develop.