From 2387eabd1c9ed798425bdb3d8638ad7c30883236 Mon Sep 17 00:00:00 2001 From: Trang Le Date: Mon, 23 Aug 2021 15:46:21 +0700 Subject: [PATCH 1/2] Add guide for gatsby-plugin-mdx --- docs/tutorial/remark-plugin-tutorial.md | 19 +++++++++++++++++++ 1 file changed, 19 insertions(+) diff --git a/docs/tutorial/remark-plugin-tutorial.md b/docs/tutorial/remark-plugin-tutorial.md index 494cca2707c53..3f67884f66d37 100644 --- a/docs/tutorial/remark-plugin-tutorial.md +++ b/docs/tutorial/remark-plugin-tutorial.md @@ -164,6 +164,25 @@ If you want to add some options, you could switch to the object syntax: } ``` +In case you use `gatsby-plugin-mdx` in place of `gatsby-transformer-remark`, the former takes an array config option named `gatsbyRemarkPlugins` that allows compatibility with Gatsby Remark plugins. + +To make `gatsby-plugin-mdx` recognize a local plugin like `gatsby-remark-purple-headers`, you need to point to its location in the project through `require.resolve`. + +```js +{ + resolve: `gatsby-plugin-mdx`, + options: { + gatsbyRemarkPlugins: [ + { + resolve: require.resolve(`./plugins/gatsby-remark-purple-headers`), + } + ] + } +} +``` + +On the other hand, if the sub-plugin is published and installed via npm, simply refer to it by name as the case with using `gatsby-transformer-remark`. + ## Find and Modify Markdown Nodes When modifying nodes, you'll want to walk the tree and then implement new functionality on specific nodes. From 870b0ccb2af58dc5049c1b80cc18fbab1e75e525 Mon Sep 17 00:00:00 2001 From: Lennart Date: Thu, 26 Aug 2021 09:26:48 +0200 Subject: [PATCH 2/2] Update remark-plugin-tutorial.md --- docs/tutorial/remark-plugin-tutorial.md | 6 ++++-- 1 file changed, 4 insertions(+), 2 deletions(-) diff --git a/docs/tutorial/remark-plugin-tutorial.md b/docs/tutorial/remark-plugin-tutorial.md index 3f67884f66d37..9d4e091dd0c41 100644 --- a/docs/tutorial/remark-plugin-tutorial.md +++ b/docs/tutorial/remark-plugin-tutorial.md @@ -164,7 +164,9 @@ If you want to add some options, you could switch to the object syntax: } ``` -In case you use `gatsby-plugin-mdx` in place of `gatsby-transformer-remark`, the former takes an array config option named `gatsbyRemarkPlugins` that allows compatibility with Gatsby Remark plugins. +### `gatsby-plugin-mdx` + +In case you use `gatsby-plugin-mdx` in place of `gatsby-transformer-remark`, the former takes an array config option named `gatsbyRemarkPlugins` that allows compatibility with Gatsby's remark plugins. To make `gatsby-plugin-mdx` recognize a local plugin like `gatsby-remark-purple-headers`, you need to point to its location in the project through `require.resolve`. @@ -181,7 +183,7 @@ To make `gatsby-plugin-mdx` recognize a local plugin like `gatsby-remark-purple- } ``` -On the other hand, if the sub-plugin is published and installed via npm, simply refer to it by name as the case with using `gatsby-transformer-remark`. +However, if the sub-plugin is published and installed via npm, simply refer to it by name as the case with using `gatsby-transformer-remark`. ## Find and Modify Markdown Nodes