What is gatsby-source-filesystem?
The gatsby-source-filesystem plugin is used in Gatsby to source data from the local filesystem. It allows you to read files from your project directory and make them available to your Gatsby site as GraphQL nodes. This is particularly useful for sourcing data from markdown files, images, JSON files, and other static assets.
What are gatsby-source-filesystem's main functionalities?
Sourcing Markdown Files
This configuration allows you to source markdown files from the 'src/markdown-pages' directory. These files can then be queried using GraphQL and transformed into pages or other content.
const path = require('path');
module.exports = {
plugins: [
{
resolve: 'gatsby-source-filesystem',
options: {
name: 'markdown-pages',
path: path.join(__dirname, 'src', 'markdown-pages'),
},
},
],
};
Sourcing Images
This configuration allows you to source image files from the 'src/images' directory. These images can then be processed and optimized using other Gatsby plugins like gatsby-plugin-sharp.
const path = require('path');
module.exports = {
plugins: [
{
resolve: 'gatsby-source-filesystem',
options: {
name: 'images',
path: path.join(__dirname, 'src', 'images'),
},
},
],
};
Sourcing JSON Files
This configuration allows you to source JSON files from the 'src/data' directory. These JSON files can then be queried using GraphQL and used to build dynamic pages or components.
const path = require('path');
module.exports = {
plugins: [
{
resolve: 'gatsby-source-filesystem',
options: {
name: 'data',
path: path.join(__dirname, 'src', 'data'),
},
},
],
};
Other packages similar to gatsby-source-filesystem
gatsby-source-contentful
gatsby-source-contentful is a Gatsby plugin that sources data from Contentful, a headless CMS. Unlike gatsby-source-filesystem, which sources data from the local filesystem, gatsby-source-contentful fetches data from a remote CMS, making it suitable for projects that require a more dynamic content management solution.
gatsby-source-drupal
gatsby-source-drupal is a Gatsby plugin that sources data from a Drupal site. This plugin is useful for projects that need to integrate with an existing Drupal CMS. It provides similar functionality to gatsby-source-filesystem but for data stored in a Drupal backend.
gatsby-source-wordpress
gatsby-source-wordpress is a Gatsby plugin that sources data from a WordPress site. This plugin is ideal for projects that want to leverage WordPress as a headless CMS. It offers similar capabilities to gatsby-source-filesystem but for WordPress content.