Next.js 15: Getting error from esbuild with `shiki` `langAlias` config
Whenever I add langALias to the @shikijs/rehype plugin, the build for the .mdx file containing a code block with the aliased language fails.
const blogs = defineCollection({
name: "blogs",
directory: "content",
include: "blogs/*.mdx",
schema: blogSchema,
transform: async (_data, context) => {
// Other ops
const html = await compileMDX(context, data, {
remarkPlugins: [
remarkMath,
remarkGemoji,
[remarkGfm, { singleTilde: false }],
],
rehypePlugins: [
rehypeSlug,
[rehypeAutolinkHeadings, { behavior: "wrap" }],
rehypeKatex,
[
rehypeShiki,
{
theme: "material-theme-darker",
transformers: [
transformerNotationDiff(),
transformerNotationHighlight(),
transformerNotationFocus(),
transformerNotationErrorLevel(),
{
pre(hast) {
hast.properties["data-meta"] = this.options.meta?.__raw;
hast.properties["data-code"] = this.source;
hast.properties["data-language"] = this.options.lang;
},
code(hast) {
hast.properties["data-line-numbers-max-digits"] =
this.lines.length.toString().length;
},
} satisfies ShikiTransformer,
],
inline: "tailing-curly-colon",
langAlias: {
"file-tree": "plain", // this fails if used
},
},
],
],
});
return {
...data,
html,
};
},
});
## A file tree example
```file-tree
\```
I have 2 mdx files, but the one where file-tree lang is used, fails
I'm not sure if this is a problem with content collections. Can you provide a sample repository?
I did not get any good error message, so I asked here. it might be an issue with shiki or maybe @mdx-js/esbuild. I use it in my portfolio. It does not have the code with the langAlias set. If you want I can setup a branch with it set.
If you want I can setup a branch with it set.
Yes, please, then I would take a quick look to see if I notice anything.
https://github.com/bismitpanda/portfolio-next/tree/langAlias-check
This is the branch. If you run pnpm build, it will be built, but an error will be shown and that file will not be added to the collection (blog collection), instead of the build failing.
If you go to localhost:3000/blog/kitchen-sink after pnpm dev, you can see the error.
I think the problem is something with shiki. If i change the alias from file-tree to tree everything works as expected.