测试在测试的时候,给我提了一个优化的点,希望如果是网址的话,点击链接能够新开一个标签页面,我就使用了 markdown-it-link-attributes插件

安装必要的依赖

首先,确保你安装了 `markdown-it` 和 `markdown-it-link-attributes` 插件:

npm install markdown-it markdown-it-link-attributes

示例代码


展示如何配置 `markdown-it` 以确保所有链接都在新标签页中打开:

 

import markdownit from "markdown-it";

import linkAttributes from "markdown-it-link-attributes"
import texmath from "markdown-it-texmath";
import katex from "katex";


const md = markdownit({
    html: true,
    breaks: true,
    linkify: true,
    typographer: true
});
// 使用 texmath 插件,并配置引擎和分隔符
md.use(texmath, {
    engine: katex,
    delimiters: [
        "dollars", "brackets" // 支持美元符号和方括号作为分隔符
    ]

})
// 使用 linkAttributes 插件,并配置目标属性和 rel 属性
md.use(linkAttributes, {
    pattern: /https?:\/\/(www\.)?/i, // 匹配所有 HTTP/HTTPS 链接
    attrs: {
        target: '_blank', // 设置所有链接在新标签页打开
        rel: 'noopener' // 增加这个属性可以提高安全性
    }
})



//省略其他代码


//最终使用
 return md.render(markdown);



 

Logo

北京人形旗下天工造物具身智能开源社区,聚焦具身天工与慧思开物两大平台

更多推荐