Gatsby Markdown
by John Vincent
Posted on September 20, 2019
Let's build Markdown
pages with Gatsby.
Gatsby Markdown Plugin
Using the plugin gatsby-transformer-remark
, add to gatsby-config.js
{
resolve: `gatsby-transformer-remark`,
options: {
excerpt_separator: `<!-- end -->`,
plugins: [`gatsby-plugin-catch-links`],
},
},
Use the excerpt_separator
in your markdown files to notify the parser of the end of your excerpt.
Gatsby needs to know where to find the markdown files
{
resolve: `gatsby-source-filesystem`,
options: {
name: `markdown-content`,
path: `${__dirname}/src/markdown/content`,
},
},
{
resolve: `gatsby-source-filesystem`,
options: {
name: `markdown-blogs`,
path: `${__dirname}/src/markdown/blogs`,
},
},
My markdown files have different purposes and need to be handled differently in gatsby-node.js
gatsby-node.js
generates the pages of the website.
Gatsby
- Gatsby and Client Only Components
- Gatsby Getting Started
- Gatsby Google Analytics
- Gatsby Google Maps
- Gatsby Helmet
- Gatsby Manifest
- Gatsby Markdown
- Gatsby Overview of johnvincent.io
- Gatsby React Icons
- Gatsby Robots file
- Gatsby RSS Feed
- Gatsby Sass
- Gatsby Sitemap
- Gatsby Webpack Bundle Analyzer
- Migration of johnvincent.io to Next.js from Gatsby
- Overview of port to Next.js from Gatsby