Revert "perf(gatsby-plugin-mdx): drop another babel step during sourc…

…ing (#25757)"

This reverts commit 6d0c791.

packages/gatsby-plugin-mdx/gatsby/on-create-node.js

@@ -6,6 +6,7 @@ const { createContentDigest } = require(`gatsby-core-utils`)
 const defaultOptions = require(`../utils/default-options`)
 const createMDXNode = require(`../utils/create-mdx-node`)
 const { MDX_SCOPES_LOCATION } = require(`../constants`)
+const { findImports } = require(`../utils/gen-mdx`)
 
 const contentDigest = val => createContentDigest(val)
 
@@ -17,7 +18,6 @@ module.exports = async (
     createNodeId,
     getNode,
     getNodes,
-    getNodesByType,
     reporter,
     cache,
     pathPrefix,
@@ -46,14 +46,20 @@ module.exports = async (
 
   const content = await loadNodeContent(node)
 
-  const { mdxNode, scopeIdentifiers, scopeImports } = await createMDXNode({
+  const mdxNode = await createMDXNode({
     id: createNodeId(`${node.id} >>> Mdx`),
     node,
     content,
+  })
 
+  createNode(mdxNode)
+  createParentChildLink({ parent: node, child: mdxNode })
+
+  // write scope files into .cache for later consumption
+  const { scopeImports, scopeIdentifiers } = await findImports({
+    node: mdxNode,
     getNode,
     getNodes,
-    getNodesByType,
     reporter,
     cache,
     pathPrefix,
@@ -63,11 +69,6 @@ module.exports = async (
     createNodeId,
     ...helpers,
   })
-
-  createNode(mdxNode)
-  createParentChildLink({ parent: node, child: mdxNode })
-
-  // write scope files into .cache for later consumption
   await cacheScope({
     cache,
     scopeIdentifiers,

packages/gatsby-plugin-mdx/loaders/mdx-loader.js

@@ -94,7 +94,6 @@ module.exports = async function (content) {
   const {
     getNode: rawGetNode,
     getNodes,
-    getNodesByType,
     reporter,
     cache,
     pathPrefix,
@@ -122,15 +121,11 @@ module.exports = async function (content) {
 
   let mdxNode
   try {
-    // This node attempts to break the chicken-egg problem, where parsing mdx
-    // allows for custom plugins, which can receive a mdx node
-    ;({ mdxNode } = await createMDXNode({
+    mdxNode = await createMDXNode({
       id: `fakeNodeIdMDXFileABugIfYouSeeThis`,
       node: fileNode,
       content,
-      options,
-      getNodesByType,
-    }))
+    })
   } catch (e) {
     return callback(e)
   }
@@ -197,7 +192,6 @@ ${contentWithoutFrontmatter}`
     node: { ...mdxNode, rawBody: code },
     getNode,
     getNodes,
-    getNodesByType,
     reporter,
     cache,
     pathPrefix,

packages/gatsby-plugin-mdx/loaders/mdx-loader.test.js

@@ -16,9 +16,9 @@ array: [1,2,3]
 )`,
     namedExports: `export const meta = {author: "chris"}`,
     body: `# Some title
-
+    
 a bit of a paragraph
-
+    
 some content`,
   }
 

packages/gatsby-plugin-mdx/utils/create-mdx-node.js

@@ -1,19 +1,20 @@
 const { createContentDigest } = require(`gatsby-core-utils`)
 
-const { findImportsExports } = require(`../utils/gen-mdx`)
-
-async function createMdxNode({ id, node, content, ...helpers }) {
-  const {
-    frontmatter,
-    scopeImports,
-    scopeExports,
-    scopeIdentifiers,
-  } = await findImportsExports({
-    mdxNode: node,
-    rawInput: content,
-    absolutePath: node.absolutePath,
-    ...helpers,
-  })
+const mdx = require(`../utils/mdx`)
+const extractExports = require(`../utils/extract-exports`)
+
+module.exports = async ({ id, node, content }) => {
+  let code
+  try {
+    code = await mdx(content)
+  } catch (e) {
+    // add the path of the file to simplify debugging error messages
+    e.message += `${node.absolutePath}: ${e.message}`
+    throw e
+  }
+
+  // extract all the exports
+  const { frontmatter, ...nodeExports } = extractExports(code)
 
   const mdxNode = {
     id,
@@ -23,23 +24,23 @@ async function createMdxNode({ id, node, content, ...helpers }) {
       content: content,
       type: `Mdx`,
     },
-    excerpt: frontmatter.excerpt,
-    exports: scopeExports,
-    rawBody: content,
-    frontmatter: {
-      title: ``, // always include a title
-      ...frontmatter,
-    },
   }
 
+  mdxNode.frontmatter = {
+    title: ``, // always include a title
+    ...frontmatter,
+  }
+
+  mdxNode.excerpt = frontmatter.excerpt
+  mdxNode.exports = nodeExports
+  mdxNode.rawBody = content
+
   // Add path to the markdown file path
   if (node.internal.type === `File`) {
     mdxNode.fileAbsolutePath = node.absolutePath
   }
 
   mdxNode.internal.contentDigest = createContentDigest(mdxNode)
 
-  return { mdxNode, scopeIdentifiers, scopeImports }
+  return mdxNode
 }
-
-module.exports = createMdxNode

packages/gatsby-plugin-mdx/utils/gen-mdx.js

@@ -47,7 +47,6 @@ async function genMDX(
     options,
     getNode,
     getNodes,
-    getNodesByType,
     reporter,
     cache,
     pathPrefix,
@@ -115,7 +114,6 @@ export const _frontmatter = ${JSON.stringify(data)}`
       //          files,
       getNode,
       getNodes,
-      getNodesByType,
       reporter,
       cache,
       pathPrefix,
@@ -196,10 +194,8 @@ ${code}`
 module.exports = genMDX // Legacy API, drop in v3 in favor of named export
 module.exports.genMDX = genMDX
 
-async function findImportsExports({
-  mdxNode,
-  rawInput,
-  absolutePath = null,
+async function findImports({
+  node,
   options,
   getNode,
   getNodes,
@@ -209,12 +205,12 @@ async function findImportsExports({
   pathPrefix,
   ...helpers
 }) {
-  const { data: frontmatter, content } = grayMatter(rawInput)
+  const { content } = grayMatter(node.rawBody)
 
   const gatsbyRemarkPluginsAsremarkPlugins = await getSourcePluginsAsRemarkPlugins(
     {
       gatsbyRemarkPlugins: options.gatsbyRemarkPlugins,
-      mdxNode,
+      mdxNode: node,
       getNode,
       getNodes,
       getNodesByType,
@@ -230,19 +226,18 @@ async function findImportsExports({
   )
 
   const compilerOptions = {
-    filepath: absolutePath,
+    filepath: node.fileAbsolutePath,
     ...options,
     remarkPlugins: [
       ...options.remarkPlugins,
       ...gatsbyRemarkPluginsAsremarkPlugins,
     ],
   }
-
   const compiler = mdx.createCompiler(compilerOptions)
 
   const fileOpts = { contents: content }
-  if (absolutePath) {
-    fileOpts.path = absolutePath
+  if (node.fileAbsolutePath) {
+    fileOpts.path = node.fileAbsolutePath
   }
 
   const mdast = await compiler.parse(fileOpts)
@@ -251,19 +246,16 @@ async function findImportsExports({
   // we don't need to dedupe the symbols here.
   const identifiers = []
   const imports = []
-  const exports = []
 
   mdast.children.forEach(node => {
-    if (node.type === `import`) {
-      const importCode = node.value
+    if (node.type !== `import`) return
 
-      imports.push(importCode)
+    const importCode = node.value
 
-      const bindings = parseImportBindings(importCode)
-      identifiers.push(...bindings)
-    } else if (node.type === `export`) {
-      exports.push(node.value)
-    }
+    imports.push(importCode)
+
+    const bindings = parseImportBindings(importCode)
+    identifiers.push(...bindings)
   })
 
   if (!identifiers.includes(`React`)) {
@@ -272,11 +264,9 @@ async function findImportsExports({
   }
 
   return {
-    frontmatter,
     scopeImports: imports,
-    scopeExports: exports,
     scopeIdentifiers: identifiers,
   }
 }
 
-module.exports.findImportsExports = findImportsExports
+module.exports.findImports = findImports