欧美bbbwbbbw肥妇,免费乱码人妻系列日韩,一级黄片

Remix中mdx?table不支持表格解決

 更新時(shí)間：2023年05月06日 10:51:53   作者：?jiǎn)讨蝊x  
這篇文章主要為大家介紹了Remix中mdx?table不支持表格問(wèn)題解決，有需要的朋友可以借鑒參考下，希望能夠有所幫助，祝大家多多進(jìn)步，早日升職加薪

remix 配置文件中配置 mdx 屬性

remix 中支持 md/mdx 語(yǔ)法，但是 Remix 語(yǔ)法沒(méi)有內(nèi)置對(duì) markdown 表格的支持。

mdx 配置在 Remix 文檔很不明顯，從 remix 的配置文件的 .d.ts 文件。

export interface AppConfig {
    mdx?: RemixMdxConfig | RemixMdxConfigFunction;
}
export interface RemixMdxConfig {
    rehypePlugins?: any[];
    remarkPlugins?: any[];
}
export type RemixMdxConfigFunction = (filename: string) => Promise<RemixMdxConfig | undefined> | RemixMdxConfig | undefined;

添加插件 remark-gfm

Remix 通過(guò) remark 等支持 markdown 語(yǔ)法，但是默認(rèn)沒(méi)有 表格等 gfm 插件支持。

npm install remark-gfm

添加配置：

/** @type {import('@remix-run/dev').AppConfig} */
module.exports = {
  // ...
  mdx: async (filename) => {
    const [rehypeHighlight, remarkToc, gfm] = await Promise.all([
      import("rehype-highlight").then((mod) => mod.default),
      import("remark-toc").then((mod) => mod.default),
      import("remark-gfm").then((mod) => mod.default),
    ]);
    return {
      remarkPlugins: [remarkToc, gfm],
      rehypePlugins: [rehypeHighlight],
    };
  }
};

注意：經(jīng)過(guò)嘗試，使用 exports.mdx = async (filename) {/**/} 沒(méi)有生效。下面是支持之后的效果

以上就是Remix中mdx table不支持表格解決的詳細(xì)內(nèi)容，更多關(guān)于Remix mdx table不支持表格的資料請(qǐng)關(guān)注腳本之家其它相關(guān)文章！

相關(guān)文章

最新評(píng)論