Loading remarkrc.mjs with ESLint 'mdx/remark' option

[JulianCataldo]

Initial checklist

• I read the support docs
• I read the contributing guide
• I agree to follow the code of conduct
• I searched issues and couldn’t find anything (or linked relevant results below)

Affected packages and versions

latest

Steps to reproduce

Create a remarkrc.mjs config like:

import remarkFrontmatter from 'remark-frontmatter';
import remarkLintFrontmatterSchema from 'remark-lint-frontmatter-schema';

const remarkConfig = {
  plugins: [
    remarkFrontmatter,

    [
      remarkLintFrontmatterSchema,
      {
        schemas: {
          'content/articles/schemas/main.mdx.schema.yaml': [
            'content/articles/**/main.mdx',
          ],
        },
      },
    ],
  ],
};

export default remarkConfig;

When it's an MD file, pnpm remark . works, not when it's an MDX (it's normal).

So we need to treat MDX with ESLint which will read the remarkrc through the MDX plugin:

/** @type {import("@types/eslint").Linter.Config} */

module.exports = {
  overrides: [
    {
      files: ['*.mdx'],

      extends: ['plugin:mdx/recommended'],

      parserOptions: {
        ecmaVersion: 2015,
      },
      settings: {
        // Integration with remark-lint plugins
        'mdx/remark': true,
      },
    },
  ],
};

Only problem is that MJS file are not loaded by cosmic config.

It's blocking because all the unified eco-system is going 100% ESM, so we cannot convert our remark.mjs to a older remark.js or CJS:

// NOTE: ESLint loads remarkrc via cosmic config which doesn't support `.mjs`

module.exports = {
  plugins: [
    require('remark-frontmatter'),
    [
      require('remark-lint-frontmatter-schema'),
      {
        schemas: {
          'content/articles/schemas/main.mdx.schema.yaml': [
            'content/articles/**/main.mdx',
          ],
        },
      },
    ],
  ],
};

Expected behavior

Load MJS (optional: or even ts/mts?), like the remark lint cli / VS Code extension does.

Actual behavior

Mismatch between remark lint config when using MD versus MDX.

Side note:
Frontmatter schema plugin is incidentally working via remark cli but not the extension (this is normal, it doesn't parse the MD itself, just the frontmatter). But unfortunately I can't use this "bug" as a feature ;)

Maybe I'm missing something?
I could go with YAML / JSON configs maybe to circumvent those issues ? I admit it is not really an option as I need JS flexibility (like importing dynamically generated indexes…).

Cheers.

[ChristianMurphy]

Hey @JulianCataldo! 👋
Sorry you ran into a spot of trouble.

I'm not sure I follow your question.
remark-lint does not load configurations.
unified-engine does for the remark CLI command, and has supported ESM since version 8.2.0 https://github.com/unifiedjs/unified-engine/releases/tag/8.2.0

eslint-mdx does use cosmiconfig https://github.com/mdx-js/eslint-mdx/blob/829b6066bfd8dd05c366cf04fdb93e73d3ce2406/packages/eslint-plugin-mdx/README.md#mdxremark
to load configurations.

Only problem is that MJS file are not loaded by cosmic config

The cosmiconfig readme indicates there may be a way to load ESM https://github.com/davidtheclark/cosmiconfig

If that is not currently enabled in the eslint plugin, it would be something to raise and discuss there https://github.com/mdx-js/eslint-mdx/issues

Closing the issue here, as the issue is external to remark-lint

[ChristianMurphy]

If you haven't already, try eslint-mdx version 2, it looks like Joun added ESM support https://github.com/mdx-js/eslint-mdx/releases/tag/v2.0.0