Encountered unexpected errors while processing of 2 documents.
xAstralMars opened this issue · 2 comments
I am getting an error when generating documents in Contentlayer, the error is:
Error: Found 2 problems in 4 documents.
└── Encountered unexpected errors while processing of 2 documents. This is possibly a bug in Contentlayer. Please open an issue.
• "installation/index.mdx": UnexpectedMDXError: Error: Build failed with 1 error:
_mdx_bundler_entry_point-650ecf62-9900-471e-be1a-20b717fdcbfd.mdx:0:0: ERROR: [plugin: @mdx-js/esbuild] TypeError: Cannot read properties of undefined (reading 'inTable')
at Object.exitCodeText (file:///workspaces/ai-api-docs/node_modules/mdast-util-gfm-table/lib/index.js:123:17)
at compile (file:///workspaces/ai-api-docs/node_modules/mdast-util-from-markdown/lib/index.js:352:40)
at fromMarkdown (file:///workspaces/ai-api-docs/node_modules/mdast-util-from-markdown/lib/index.js:187:29)
at parser (file:///workspaces/ai-api-docs/node_modules/remark-parse/lib/index.js:18:12)
at Function.parse (file:///workspaces/ai-api-docs/node_modules/unified/lib/index.js:273:12)
at executor (file:///workspaces/ai-api-docs/node_modules/unified/lib/index.js:393:31)
at new Promise (<anonymous>)
at Function.process (file:///workspaces/ai-api-docs/node_modules/unified/lib/index.js:380:14)
at process (file:///workspaces/ai-api-docs/node_modules/@mdx-js/mdx/lib/util/create-format-aware-processors.js:50:22)
at onload (file:///workspaces/ai-api-docs/node_modules/@mdx-js/esbuild/lib/index.js:151:22)
at requestCallbacks.on-load (/workspaces/ai-api-docs/node_modules/esbuild/lib/main.js:1434:28)
at processTicksAndRejections (node:internal/process/task_queues:95:5)
at handleRequest (/workspaces/ai-api-docs/node_modules/esbuild/lib/main.js:729:13)
• "installation/node.mdx": UnexpectedMDXError: Error: Build failed with 1 error:
_mdx_bundler_entry_point-8fcb210e-7e8c-43a8-bddd-1d64451d8c57.mdx:0:0: ERROR: [plugin: @mdx-js/esbuild] TypeError: Cannot read properties of undefined (reading 'inTable')
at Object.exitCodeText (file:///workspaces/ai-api-docs/node_modules/mdast-util-gfm-table/lib/index.js:123:17)
at compile (file:///workspaces/ai-api-docs/node_modules/mdast-util-from-markdown/lib/index.js:352:40)
at fromMarkdown (file:///workspaces/ai-api-docs/node_modules/mdast-util-from-markdown/lib/index.js:187:29)
at parser (file:///workspaces/ai-api-docs/node_modules/remark-parse/lib/index.js:18:12)
at Function.parse (file:///workspaces/ai-api-docs/node_modules/unified/lib/index.js:273:12)
at executor (file:///workspaces/ai-api-docs/node_modules/unified/lib/index.js:393:31)
at new Promise (<anonymous>)
at Function.process (file:///workspaces/ai-api-docs/node_modules/unified/lib/index.js:380:14)
at process (file:///workspaces/ai-api-docs/node_modules/@mdx-js/mdx/lib/util/create-format-aware-processors.js:50:22)
at onload (file:///workspaces/ai-api-docs/node_modules/@mdx-js/esbuild/lib/index.js:151:22)
at requestCallbacks.on-load (/workspaces/ai-api-docs/node_modules/esbuild/lib/main.js:1434:28)
at processTicksAndRejections (node:internal/process/task_queues:95:5)
at handleRequest (/workspaces/ai-api-docs/node_modules/esbuild/lib/main.js:729:13)
SourceFetchDataError: {
"_tag": "HandledFetchDataError"
}
My contentlayer.config.ts file has this code:
import path from "path"
import {
defineDocumentType,
defineNestedType,
makeSource,
} from "contentlayer/source-files"
import rehypeAutolinkHeadings from "rehype-autolink-headings"
import rehypePrettyCode, { Options } from "rehype-pretty-code" // Import the Options type from rehype-pretty-code
import rehypeSlug from "rehype-slug"
import { codeImport } from "remark-code-import"
import remarkGfm from "remark-gfm"
import { getHighlighter, loadTheme } from "shiki"
import { visit } from "unist-util-visit"
/** @type {import('contentlayer/source-files').ComputedFields} */
const computedFields: import('contentlayer/source-files').ComputedFields<"Doc"> = {
slug: {
type: "string",
resolve: (doc: any) => /${doc._raw.flattenedPath}
,
},
slugAsParams: {
type: "string",
resolve: (doc: any) => doc._raw.flattenedPath.split("/").slice(1).join("/"),
},
}
const LinksProperties = defineNestedType(() => ({
name: "LinksProperties",
fields: {
doc: {
type: "string",
},
api: {
type: "string",
},
},
}))
export const Doc = defineDocumentType(() => ({
name: "Doc",
filePathPattern: **/*.mdx
,
contentType: "mdx",
fields: {
title: {
type: "string",
required: true,
},
description: {
type: "string",
required: true,
},
published: {
type: "boolean",
default: true,
},
links: {
type: "nested",
of: LinksProperties,
},
featured: {
type: "boolean",
default: false,
required: false,
},
component: {
type: "boolean",
default: false,
required: false,
},
toc: {
type: "boolean",
default: true,
required: false,
},
},
computedFields,
}))
export default makeSource({
contentDirPath: "./content/docs",
documentTypes: [Doc],
mdx: {
remarkPlugins: [remarkGfm, codeImport],
rehypePlugins: [
rehypeSlug,
() => (tree) => {
visit(tree, (node) => {
if (node?.type === "element" && node?.tagName === "pre") {
const [codeEl] = node.children
if (codeEl.tagName !== "code") {
return
}
if (codeEl.data?.meta) {
// Extract event from meta and pass it down the tree.
const regex = /event="([^"]*)"/
const match = codeEl.data?.meta.match(regex)
if (match) {
node.__event__ = match ? match[1] : null
codeEl.data.meta = codeEl.data.meta.replace(regex, "")
}
}
node.__rawString__ = codeEl.children?.[0].value
node.__src__ = node.properties?.__src__
node.__style__ = node.properties?.__style__
}
})
},
[
rehypePrettyCode as any as (options?: Options) => void, // Cast rehypePrettyCode to the correct type
{
getHighlighter: async () => {
const theme = await loadTheme(
path.join(process.cwd(), "/lib/themes/dark.json")
)
return await getHighlighter({ theme })
},
onVisitLine(node: any) {
// Prevent lines from collapsing in `display: grid` mode, and allow empty
// lines to be copy/pasted
if (node.children.length === 0) {
node.children = [{ type: "text", value: " " }]
}
},
onVisitHighlightedLine(node: any) {
node.properties.className.push("line--highlighted")
},
onVisitHighlightedWord(node: any) {
node.properties.className = ["word--highlighted"]
},
},
],
() => (tree) => {
visit(tree, (node) => {
if (node?.type === "element" && node?.tagName === "div") {
if (!("data-rehype-pretty-code-fragment" in node.properties)) {
return
}
const preElement = node.children.at(-1)
if (preElement.tagName !== "pre") {
return
}
preElement.properties["__withMeta__"] =
node.children.at(0).tagName === "div"
preElement.properties["__rawString__"] = node.__rawString__
if (node.__src__) {
preElement.properties["__src__"] = node.__src__
}
if (node.__event__) {
preElement.properties["__event__"] = node.__event__
}
if (node.__style__) {
preElement.properties["__style__"] = node.__style__
}
}
})
},
[
rehypeAutolinkHeadings,
{
properties: {
className: ["subheading-anchor"],
ariaLabel: "Link to section",
},
},
],
],
},
})
The issue might be due to changes in the contentlayer's configuration or the addition of a new .mdx file, causing unexpected problems. I'm not sure why this is happening, but if you want to resolve it, try removing the recent changes you made. It seems to be a significant bug, as I've encountered it more than 10 times while working on my website. My suggestion would be to consider migrating to other alternatives. Despite my previous fondness for it, I'm currently in the process of switching to @next/mdx.
And Yes, It is not getting maintained actively.
This issue has been automatically marked as stale because it has not had recent activity. It will be closed if no further activity occurs. Thank you for your contributions.