
本地MathJax.js无法正常工作?解决方案详解
在本地环境使用MathJax.js渲染LaTeX公式时,经常会遇到显示错误的问题。本文将分析问题原因并提供解决方案。
假设您已成功使用CDN版本的MathJax.js,代码如下:
<meta charset="utf-8">
<meta name="viewport" content="width=device-width">
<script>
MathJax.Hub.Config({
tex2jax: {inlineMath: [['$','$'], ['\(','\)']]},
});
</script>
<p>首先,我们可以放松∀-引入规则:$a o b dash a o orall x b$,前提是x在a中不是自由变量。</p><div class="aritcle_card flexRow">
<div class="artcardd flexRow">
<a class="aritcle_card_img" href="/ai/2173" title="吉卜力风格图片在线生成"><img
src="https://img.php.cn/upload/ai_manual/000/000/000/175680367887724.png" alt="吉卜力风格图片在线生成" onerror="this.onerror='';this.src='/static/lhimages/moren/morentu.png'" ></a>
<div class="aritcle_card_info flexColumn">
<a href="/ai/2173" title="吉卜力风格图片在线生成">吉卜力风格图片在线生成</a>
<p>将图片转换为吉卜力艺术风格的作品</p>
</div>
<a href="/ai/2173" title="吉卜力风格图片在线生成" class="aritcle_card_btn flexRow flexcenter"><b></b><span>下载</span> </a>
</div>
</div>
此代码能够正确渲染公式。
但将MathJax.js下载到本地(例如:127.0.0.1/wp/mathjax.js),并修改HTML代码如下:
<meta charset="utf-8">
<meta name="viewport" content="width=device-width">
<script src="127.0.0.1/wp/mathjax.js"></script>
<script>
MathJax.Hub.Config({
tex2jax: {inlineMath: [['$','$'], ['\(','\)']]},
});
</script>
<p>首先,我们可以放松∀-引入规则:$a o b dash a o orall x b$,前提是x在a中不是自由变量。</p>
访问127.0.0.1/wp/test.html时,却出现错误。
原因是CDN版本的MathJax.js依赖其他文件,而您只下载了mathjax.js。例如,mathjax.js可能包含类似这样的代码:
// MathJax.js import xxx from './extension/MathZoom.js'; // ...其他代码
CDN服务器上有extension/mathzoom.js等文件,但本地没有,导致404错误。
下载所有CDN文件并非理想方案,工作量巨大。建议参考MathJax官方文档,学习如何正确部署本地MathJax副本,确保所有依赖文件都可用,避免此类错误。









