MDX 코드블럭이 정상적으로 린팅되지 않던 이슈 수정

eslint.config.js

@@ -60,7 +60,7 @@ export default [
       "react/jsx-uses-vars": "error",
       "prettier/prettier": "off",
     },
-    processor: mdx.createRemarkProcessor({
+    processor: await mdx.createRemarkProcessor({
       lintCodeBlocks: true,
     }),
   },

package.json

@@ -135,7 +135,9 @@
 	"pnpm": {
 		"patchedDependencies": {
 			"@shikijs/[email protected]": "patches/@[email protected]",
-			"[email protected]": "patches/[email protected]"
+			"[email protected]": "patches/[email protected]",
+			"[email protected]": "patches/[email protected]",
+			"[email protected]": "patches/[email protected]"
 		},
 		"overrides": {
 			"@vercel/nft": "0.26.4"

patches/eslint-plugin-markdown@3.0.1.patch

@@ -0,0 +1,63 @@
+diff --git a/lib/processor.js b/lib/processor.js
+index 63aa915906021d56b1bf8099e54f166c3004baed..99e04897b02829b19a1507dacc7c03365925f77e 100644
+--- a/lib/processor.js
++++ b/lib/processor.js
+@@ -28,7 +28,22 @@
+
+ "use strict";
+
+-const parse = require("mdast-util-from-markdown");
++let fromMarkdown, mdxjs, mdxFromMarkdown;
++
++async function load() {
++    const [
++      mdastUtilFromMarkdown,
++      micromarkExtensionMdxjs,
++      mdastUtilMdx
++    ] = await Promise.all([
++        import("mdast-util-from-markdown"),
++        import("micromark-extension-mdxjs"),
++        import("mdast-util-mdx"),
++    ]);
++    fromMarkdown = mdastUtilFromMarkdown.default;
++    mdxjs = micromarkExtensionMdxjs.mdxjs;
++    mdxFromMarkdown = mdastUtilMdx.mdxFromMarkdown;
++}
+
+ const UNSATISFIABLE_RULES = [
+     "eol-last", // The Markdown parser strips trailing newlines in code fences
+@@ -242,7 +257,10 @@ function getBlockRangeMap(text, node, comments) {
+  * @returns {Array<{ filename: string, text: string }>} Source code blocks to lint.
+  */
+ function preprocess(text, filename) {
+-    const ast = parse(text);
++    const ast = fromMarkdown(text, {
++        extensions: [mdxjs()],
++        mdastExtensions: [mdxFromMarkdown()]
++    });
+     const blocks = [];
+
+     blocksCache.set(filename, blocks);
+@@ -399,6 +417,7 @@ function postprocess(messages, filename) {
+ }
+
+ module.exports = {
++    load,
+     preprocess,
+     postprocess,
+     supportsAutofix: SUPPORTS_AUTOFIX
+diff --git a/package.json b/package.json
+index 12ce48107cee49c36328cb393486e639b3bb274f..3975211b6cec56cfcce88c8e5386672632d9344a 100644
+--- a/package.json
++++ b/package.json
+@@ -47,7 +47,9 @@
+     "nyc": "^14.1.1"
+   },
+   "dependencies": {
+-    "mdast-util-from-markdown": "^0.8.5"
++    "micromark-extension-mdxjs": "3.0.0",
++    "mdast-util-from-markdown": "2.0.0",
++    "mdast-util-mdx": "3.0.0"
+   },
+   "peerDependencies": {
+     "eslint": "^6.0.0 || ^7.0.0 || ^8.0.0"

patches/eslint-plugin-mdx@3.1.5.patch

@@ -0,0 +1,31 @@
+diff --git a/lib/processors/remark.d.ts b/lib/processors/remark.d.ts
+index c2377b2f52e1ae5097a98520822f62f0c6d0c8fa..c595452fa2a95af47531e8d9ef9f24a430261990 100644
+--- a/lib/processors/remark.d.ts
++++ b/lib/processors/remark.d.ts
+@@ -1,3 +1,3 @@
+ import type { Linter } from 'eslint';
+-export declare const createRemarkProcessor: (processorOptions?: import("./types").ProcessorOptions) => Linter.Processor;
++export declare const createRemarkProcessor: (processorOptions?: import("./types").ProcessorOptions) => Promise<Linter.Processor>;
+ export declare const remark: Linter.Processor;
+diff --git a/lib/processors/remark.js b/lib/processors/remark.js
+index fbd6fc16e95566024cf5ac1d50d0e188c8de6ce1..c11fb419ca27361e5fb28d6887889db18ae61352 100644
+--- a/lib/processors/remark.js
++++ b/lib/processors/remark.js
+@@ -5,7 +5,7 @@ const eslint_plugin_markdown_1 = require("eslint-plugin-markdown");
+ const meta_1 = require("../meta");
+ const helpers_1 = require("./helpers");
+ const options_1 = require("./options");
+-const createRemarkProcessor = (processorOptions = options_1.processorOptions) => ({
++const createRemarkProcessor = (processorOptions = options_1.processorOptions) => eslint_plugin_markdown_1.processors.markdown.load().then(() => ({
+     meta: {
+         name: 'mdx/remark',
+         version: meta_1.meta.version,
+@@ -42,7 +42,7 @@ const createRemarkProcessor = (processorOptions = options_1.processorOptions) =>
+             return Object.assign(Object.assign({}, lintMessage), { ruleId: `${source}-${ruleId}`, message: reason, severity: Math.max(eslintSeverity, severity) });
+         });
+     },
+-});
++}));
+ exports.createRemarkProcessor = createRemarkProcessor;
+ exports.remark = (0, exports.createRemarkProcessor)();
+ //# sourceMappingURL=remark.js.map