常规的md转数学公式插件无法解决此问题
问题: 在渲染过程中 \t 被转义 导致渲染出错
**方案为：将\t 转义为\t **
依赖的插件及版本
"katex": "^0.16.15","markdown-it": "^14.1.0","markdown-it-katex": "^2.0.3","markdown-it-latex": "^0.2.0","markdown-it-mathjax": "^2.0.0","markdown-it-multimd-table": "^4.2.3","markdown-it-texmath": "^1.0.0","mathjax": "^3.2.2","vue-markdown": "^2.2.4",
utils 文件
mathjax.js
window.MathJax = {tex: {inlineMath: [["$", "$"],["\\(", "\\)"],["\(", "\)"],["\\[", "\\]"],], // 行内公式选择符displayMath: [["$$", "$$"],["\\[", "\\]"],['?', '?'],], // 段内公式选择符},startup: {ready() {MathJax.startup.defaultReady();},},
};
引入代码
mian.ts中
import "/@/utils/mathjax";
import "mathjax/es5/tex-svg";
vue文件中
import MarkdownIt from 'markdown-it';
import markdownItMathjax from 'markdown-it-mathjax';
import mk from 'markdown-it-katex';
import mkl from 'markdown-it-latex';import 'katex/dist/katex.min.css';
import 'github-markdown-css';
方法调用
const preprocessLaTeX = (content: string) => {if (typeof content !== 'string') return content;return content.replace(/\\\[(.*?)\\\]/gs, (_, equation) => `$$${equation}$$`).replace(/\\\((.*?)\\\)/gs, (_, equation) => `$$${equation}$$`).replace(/(^|[^\\])\$(.+?)\$/gs, (_, prefix, equation) => `${prefix}$${equation}$`).replace(/\t/g, '\\t');
};const md = new MarkdownIt({html: true,linkify: true,typographer: true,
});
md.use(markdownItMathjax);
md.use(mk, {throwOnError: false,
});
md.use(mkl);const renderMd = (text: string) => {window.MathJax.startup.defaultReady();text = preprocessLaTeX(text);return md.render(text);
};renderMd中传入的是需要 渲染到md中的文本
