[gatsby-plugin-mdx] Remark plugins are not required correctly

[jlkiri]

Description

gatsby-plugin-mdx fails to require plugins that have default exports.

Steps to reproduce

1. Clone a default gatsby-plugin-mdx starter project

gatsby new my-mdx-starter https://github.com/ChristopherBiscardi/gatsby-starter-mdx-basic

2. Include gatsby-remark-shiki as a plugin

{
      resolve: `gatsby-plugin-mdx`,
      options: {
        gatsbyRemarkPlugins: [{ resolve: `gatsby-remark-shiki` }],
        defaultLayouts: { default: path.resolve("./src/components/layout.js") }
      }
    },

3. Add some code to markdown files

4. Run gatsby develop

Expected result

Code should be formatted by gatsby-remark-shiki

Actual result

Code is not formatted. No errors occur.

Environment

  System:
    OS: macOS 10.15.3
    CPU: (4) x64 Intel(R) Core(TM) i7-7660U CPU @ 2.50GHz
    Shell: 3.2.57 - /bin/bash
  Binaries:
    Node: 12.16.0 - ~/.nvm/versions/node/v12.16.0/bin/node
    Yarn: 1.22.0 - /usr/local/bin/yarn
    npm: 6.13.4 - ~/.nvm/versions/node/v12.16.0/bin/npm
  Languages:
    Python: 2.7.16 - /usr/bin/python
  Browsers:
    Chrome: 80.0.3987.122
    Firefox: 73.0.1
    Safari: 13.0.5
  npmPackages:
    gatsby: ^2.13.50 => 2.19.22
    gatsby-image: ^2.2.8 => 2.2.41
    gatsby-plugin-manifest: ^2.2.4 => 2.2.42
    gatsby-plugin-mdx: ^1.0.0 => 1.0.74
    gatsby-plugin-offline: ^2.2.4 => 2.2.10
    gatsby-plugin-react-helmet: ^3.1.3 => 3.1.22
    gatsby-plugin-sharp: ^2.2.9 => 2.4.5
    gatsby-remark-prismjs: ^3.3.31 => 3.3.31
    gatsby-source-filesystem: ^2.1.8 => 2.1.48
    gatsby-transformer-sharp: ^2.2.5 => 2.3.16
  npmGlobalPackages:
    gatsby-dev-cli: 2.5.44

[jlkiri]

Supposedly, the reason is in the quoted line below. We do not check where the export has default. So there is literally no way result of require can be a function in these cases. Yet every plugin that is not a function gets filtered out.

Some interoperable require function should be used. I confirmed locally that it works. Example:

function _interopDefault (ex) { return (ex && (typeof ex === 'object') && 'default' in ex) ? ex['default'] : ex; }

gatsby/packages/gatsby-plugin-mdx/utils/get-source-plugins-as-remark-plugins.js

Line 46 in 4bc595b

if (_.isFunction(require(plugin.resolve))) {

[jlkiri]

It also MIGHT be the reason for other open bugs but I haven't checked yet.

[gpbl]

I believe the fix in #21866 is breaking other plugins, like gatsby-remark-custom-blocks.