Remix中mdx?table不支持表格解決
remix 配置文件中配置 mdx 屬性
remix 中支持 md/mdx 語法,但是 Remix 語法沒有內(nèi)置對 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 通過 remark 等支持 markdown 語法,但是默認沒有 表格等 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)過嘗試,使用 exports.mdx = async (filename) {/**/}
沒有生效。下面是支持之后的效果
以上就是Remix中mdx table不支持表格解決的詳細內(nèi)容,更多關(guān)于Remix mdx table不支持表格的資料請關(guān)注腳本之家其它相關(guān)文章!
相關(guān)文章
詳解React如何實現(xiàn)代碼分割Code Splitting
這篇文章主要為大家介紹了React如何實現(xiàn)代碼分割Code Splitting示例詳解,有需要的朋友可以借鑒參考下,希望能夠有所幫助,祝大家多多進步,早日升職加薪2023-08-08react 頁面加載完成后自動執(zhí)行標(biāo)簽的點擊事件的兩種操作方法
這篇文章主要介紹了react 頁面加載完成后自動執(zhí)行標(biāo)簽的點擊事件,本文給大家分享兩種操作方法結(jié)合示例代碼給大家講解的非常詳細,需要的朋友可以參考下2022-12-12如何去除富文本中的html標(biāo)簽及vue、react、微信小程序中的過濾器
這篇文章主要介紹了如何去除富文本中的html標(biāo)簽及vue、react、微信小程序中的過濾器,在vue及react中經(jīng)常會遇到,今天通過實例代碼給大家講解,需要的朋友可以參考下2018-11-11React項目中fetch實現(xiàn)跨域接收傳遞session的解決方案
這篇文章主要介紹了React項目中fetch實現(xiàn)跨域接收傳遞session的解決方案,本次項目使用了react框架,同時使用fetch取代ajax作為獲取接口數(shù)據(jù)的交互方法,下面就對這次問題的解決做個總結(jié),需要的朋友可以參考下2022-04-04React Native AsyncStorage本地存儲工具類
這篇文章主要為大家分享了React Native AsyncStorage本地存儲工具類,具有一定的參考價值,感興趣的小伙伴們可以參考一下2017-10-10React如何使用refresh_token實現(xiàn)無感刷新頁面
本文主要介紹了React如何使用refresh_token實現(xiàn)無感刷新頁面,文中通過示例代碼介紹的非常詳細,對大家的學(xué)習(xí)或者工作具有一定的參考學(xué)習(xí)價值,需要的朋友們下面隨著小編來一起學(xué)習(xí)學(xué)習(xí)吧2022-04-04