MathJax可以导入到本地HTML文档使用的JS文件中吗？

问题描述 投票：0回答：1

在 MathJax homepage 上，我们找到了将 tex-mml-chtml 配置直接导入 HTML 文档的代码，无需任何服务器。尝试稍微修改样板下面的 jsbin 上的示例，我将 import 语句分离到本地计算机上的 JS 和 HTML 文件中：

index.html

<!DOCTYPE html> <html> <head> <meta charset="utf-8"> <meta name="viewport" content="width=device-width"> <title>MathJax example</title> <script id="main" type="module" src="main.js"> </script> </head> <body> <p> When \(a \ne 0\), there are two solutions to \(ax^2 + bx + c = 0\) and they are \[x = {-b \pm \sqrt{b^2-4ac} \over 2a}.\] </p> </body> </html> 

main.js

import * as jax from "https://cdn.jsdelivr.net/npm/mathjax@3/es5/tex-mml-chtml.js";



我收到以下错误：



和扭曲的输出，尽管它仍然尝试：



我不确定这个结果是否是因为我们只是
不能
以这种方式使用MathJax（正确的方式是在源HTML文档中调用，或者通过服务器），或者因为我缺少一些JS，或者因为我调用错误的配置等等
如果这是
不
可能的，请解释为什么不可以（也许是某些 CORS 机制？错误地使用 JS 模块？MathJax 根本不是这样设计的？）将不胜感激！
    




    
    javascript
    
    html
    
    mathjax
    
    
1个回答

    

      
      
      

        

          

            

              
0
投票

              
            

          

        

        
tex-mml-chtml
 文件中没有的额外资源；在你的情况下，它是字体文件。因此它需要知道从哪里获取它们。通常，MathJax 将使用加载它的 
src
 标签的 
script
 属性查找加载它的位置。然而，在您的情况下，由于您将其导入到另一个文件中，而不是使用自己的 
script
 标签加载它，MathJax 无法弄清楚应该在哪里查找其他资源。
为了克服这个问题，您需要让 MathJax 明确地放置其文件的位置。您可以通过包含来做到这一点


<script>
window.MathJax = {
  loader: {
    paths: {
      mathjax: 'url-for-the-mathjax-files'
    }
  }
};
</script>



before
 加载 MathJax 本身的脚本（即，在加载 main.js 文件之前）。当然，您可以将 
window.MathJax
 声明放入单独的文件中，然后将 
import
 放入您的 
main.js
 文件中，然后放在 
import
 的 
tex-mml-chtml.js
 之前。
正如评论中提到的，
tex-mml-chtml.js
现在有任何导出，所以你只需要做
import "https://cdn.jsdelivr.net/npm/mathjax@3/es5/tex-mml-chtml.js";



加载它。

    



      

      
    

  

  

    
最新问题


  





  

    © www.soinside.com 2019 - 2024. All rights reserved.