Skip to main content

Using a Plugin in Your Site

Gatsby plugins are Node.js packages, so you can install them like other packages in node using NPM.

For example, gatsby-transformer-json is a package which adds support for JSON files to the Gatsby data layer.

To install it, in the root of your site you run:

npm install --save gatsby-transformer-json

Then in your site’s gatsby-config.js you add gatsby-transformer-json to the plugins array like:

gatsby-config.js
module.exports = {
plugins: [`gatsby-transformer-json`],
}

Plugins can take options. For example:

gatsby-config.js
module.exports = {
plugins: [
// Shortcut for adding plugins without options.
"gatsby-plugin-react-helmet",
{
// Standard plugin with options example
resolve: `gatsby-source-filesystem`,
options: {
path: `${__dirname}/src/data/`,
name: "data",
},
},
{
resolve: "gatsby-plugin-offline",
// Blank options, equivalent to string-only plugin
options: {
plugins: [],
},
},
{
resolve: `gatsby-transformer-remark`,
options: {
// plugins inside plugins
plugins: [`gatsby-remark-smartypants`],
},
},
],
}

Note that plugin options will be stringified by Gatsby, so they cannot be functions.


Edit this page on GitHub
Docs
Tutorials
Plugins
Blog
Showcase