테스트로 mdx 문서 생성

Author: echoja

next.config.js

@@ -20,6 +20,8 @@ const withBundleAnalyzer = require("@next/bundle-analyzer")({
   enabled: process.env.ANALYZE === "true",
 });
 
-const withMDX = require("@next/mdx")();
+const withMDX = require("@next/mdx")({
+  extension: /\.mdx?$/,
+});
 
 module.exports = withMDX(withBundleAnalyzer(config));

package.json

@@ -32,7 +32,6 @@
     "@next/mdx": "^13.4.4",
     "@supabase/supabase-js": "2.23.0",
     "@tailwindcss/forms": "^0.5.3",
-    "@types/mdx": "^2.0.5",
     "@upstash/qstash": "^0.3.6",
     "axios": "^1.4.0",
     "date-fns": "^2.30.0",
@@ -75,6 +74,7 @@
     "@types/is-url": "^1.2.30",
     "@types/markdown-it": "^12.2.3",
     "@types/react": "^18.2.7",
+    "@types/mdx": "^2.0.5",
     "autoprefixer": "^10.4.14",
     "commitlint": "^17.6.3",
     "concurrently": "^8.0.1",

pnpm-lock.yaml

@@ -0,0 +1,3 @@
+Hello, Next.js!
+
+You can import and use React components in MDX files.

src/app/hello/doc.mdx

@@ -0,0 +1,5 @@
+import HelloWorld from "./doc.mdx";
+
+export default function Page() {
+  return <HelloWorld />;
+}

src/app/hello/page.tsx

@@ -6,6 +6,7 @@ import type { MDXComponents } from "mdx/types";
 // other libraries.
 
 // This file is required to use MDX in `app` directory.
+// eslint-disable-next-line import/prefer-default-export
 export function useMDXComponents(components: MDXComponents): MDXComponents {
   return {
     // Allows customizing built-in components, e.g. to add styling.

src/mdx-components.tsx

@@ -1,4 +1,4 @@
-// Vitest Snapshot v1
+// Vitest Snapshot v1, https://vitest.dev/guide/snapshot.html
 
 exports[`convert > getElement > \\n이 여러 개 있을 때 1`] = `
 {

src/modules/content/code-block/__snapshots__/convert.test.ts.snap

@@ -1,4 +1,4 @@
-// Vitest Snapshot v1
+// Vitest Snapshot v1, https://vitest.dev/guide/snapshot.html
 
 exports[`getPublishedPost > 제대로 동작해야 함 1`] = `
 [

src/modules/import/wordpress/__snapshots__/parse.test.ts.snap

@@ -1,4 +1,4 @@
-// Vitest Snapshot v1
+// Vitest Snapshot v1, https://vitest.dev/guide/snapshot.html
 
 exports[`htmlToSlateFragment > Wordpress Content > 실제 워드프레스 포스팅을 잘 변환해야 함: 35 1`] = `
 [

src/modules/parse/__snapshots__/html-to-slate-node.test.ts.snap

@@ -1,11 +1,7 @@
 {
   "compilerOptions": {
     "target": "es2018",
-    "lib": [
-      "es2018",
-      "esnext.asynciterable",
-      "DOM"
-    ],
+    "lib": ["es2018", "esnext.asynciterable", "DOM"],
     "allowJs": true,
     "skipLibCheck": true,
     "strict": true,
@@ -20,16 +16,9 @@
     "jsx": "preserve",
     "baseUrl": "src",
     "incremental": true,
-    "types": [
-      "vitest/globals"
-    ],
     "paths": {
-      "@common/*": [
-        "common/*"
-      ],
-      "@modules/*": [
-        "modules/*"
-      ]
+      "@common/*": ["common/*"],
+      "@modules/*": ["modules/*"]
     },
     "plugins": [
       {
@@ -45,7 +34,5 @@
     "commitlint.config.js",
     ".next/types/**/*.ts"
   ],
-  "exclude": [
-    "node_modules"
-  ]
+  "exclude": ["node_modules"]
 }

tsconfig.json

@@ -0,0 +1 @@
+/// <reference types="vitest/globals" />