feat: use same jsxRuntime as Gatsby by default

gatsbyjs · Aug 5, 2022 · 7233c49 · 7233c49
1 parent afedd44
commit 7233c49
Show file tree

Hide file tree

Showing 3 changed files with 35 additions and 5 deletions.
diff --git a/packages/gatsby-plugin-mdx/src/compile-mdx.ts b/packages/gatsby-plugin-mdx/src/compile-mdx.ts
@@ -71,6 +71,7 @@ export const compileMDXWithCustomOptions = async (
  pathPrefix,
  reporter,
  cache,
+ store,
  }: {
  pluginOptions: PluginOptions
  customOptions: Partial<IMdxPluginOptions>
@@ -79,6 +80,7 @@ export const compileMDXWithCustomOptions = async (
  pathPrefix: string
  reporter: NodePluginArgs["reporter"]
  cache: NodePluginArgs["cache"]
+ store: NodePluginArgs["store"]
  }
 ): Promise<{
  processedMDX: string
@@ -96,6 +98,7 @@ export const compileMDXWithCustomOptions = async (
  pathPrefix,
  reporter,
  cache,
+ store,
  })
 
  // Compile MDX and extract metadata

diff --git a/packages/gatsby-plugin-mdx/src/gatsby-node.ts b/packages/gatsby-plugin-mdx/src/gatsby-node.ts
@@ -18,7 +18,16 @@ import { cachedImport, createFileToMdxCacheKey } from "./cache-helpers"
  */
 export const onCreateWebpackConfig: GatsbyNode["onCreateWebpackConfig"] =
  async (
- { actions, loaders, getNode, getNodesByType, pathPrefix, reporter, cache },
+ {
+ actions,
+ loaders,
+ getNode,
+ getNodesByType,
+ pathPrefix,
+ reporter,
+ cache,
+ store,
+ },
  pluginOptions
  ) => {
  const options = defaultOptions(pluginOptions)
@@ -29,6 +38,7 @@ export const onCreateWebpackConfig: GatsbyNode["onCreateWebpackConfig"] =
  pathPrefix,
  reporter,
  cache,
+ store,
  })
 
  const mdxLoaderOptions: IGatsbyMDXLoaderOptions = {
@@ -96,7 +106,7 @@ export const resolvableExtensions: GatsbyNode["resolvableExtensions"] = (
  * Convert MDX to JSX so that Gatsby can extract the GraphQL queries and render the pages.
  */
 export const preprocessSource: GatsbyNode["preprocessSource"] = async (
- { filename, getNode, getNodesByType, pathPrefix, reporter, cache },
+ { filename, getNode, getNodesByType, pathPrefix, reporter, cache, store },
  pluginOptions
 ) => {
  const options = defaultOptions(pluginOptions)
@@ -113,6 +123,7 @@ export const preprocessSource: GatsbyNode["preprocessSource"] = async (
  pathPrefix,
  reporter,
  cache,
+ store,
  })
 
  const ext = path.extname(mdxPath)
@@ -141,7 +152,16 @@ export const preprocessSource: GatsbyNode["preprocessSource"] = async (
 
 export const createSchemaCustomization: GatsbyNode["createSchemaCustomization"] =
  async (
- { getNode, getNodesByType, pathPrefix, reporter, cache, actions, schema },
+ {
+ getNode,
+ getNodesByType,
+ pathPrefix,
+ reporter,
+ cache,
+ actions,
+ schema,
+ store,
+ },
  pluginOptions
  ) => {
  const { createTypes } = actions
@@ -190,6 +210,7 @@ export const createSchemaCustomization: GatsbyNode["createSchemaCustomization"]
  pathPrefix,
  reporter,
  cache,
+ store,
  }
  )
 
@@ -239,6 +260,7 @@ export const createSchemaCustomization: GatsbyNode["createSchemaCustomization"]
  pathPrefix,
  reporter,
  cache,
+ store,
  }
  )
 

diff --git a/packages/gatsby-plugin-mdx/src/plugin-options.ts b/packages/gatsby-plugin-mdx/src/plugin-options.ts
@@ -1,5 +1,5 @@
 import type { ProcessorOptions } from "@mdx-js/mdx"
-import type { GatsbyCache, NodePluginArgs, PluginOptions } from "gatsby"
+import type { GatsbyCache, NodePluginArgs, PluginOptions, Store } from "gatsby"
 import deepmerge from "deepmerge"
 import type { IPluginRefObject } from "gatsby-plugin-utils/types"
 import { getSourcePluginsAsRemarkPlugins } from "./get-source-plugins-as-remark-plugins"
@@ -18,6 +18,7 @@ interface IHelpers {
  pathPrefix: NodePluginArgs["pathPrefix"]
  reporter: NodePluginArgs["reporter"]
  cache: GatsbyCache
+ store: Store
 }
 type MdxDefaultOptions = (pluginOptions: PluginOptions) => IMdxPluginOptions
 
@@ -26,7 +27,6 @@ export const defaultOptions: MdxDefaultOptions = pluginOptions => {
  format: `mdx`,
  useDynamicImport: true,
  providerImportSource: `@mdx-js/react`,
- jsxRuntime: `classic`,
  }
  const defaults = {
  extensions: [`.mdx`],
@@ -51,6 +51,11 @@ export const enhanceMdxOptions: EnhanceMdxOptions = async (
 ) => {
  const options = defaultOptions(pluginOptions)
 
+ // Set jsxRuntime based on Gatsby project config
+ const { config } = helpers.store.getState()
+ const { jsxRuntime } = config
+ options.mdxOptions.jsxRuntime = jsxRuntime || `classic`
+
  if (!options.mdxOptions.remarkPlugins) {
  options.mdxOptions.remarkPlugins = []
  }