javascript - MathJax 与 WebPack ReferenceError : require is not defined

Question

我想将公式放在我的网页中，该网页使用(dotnet Kestrel)。我不想从网上加载 javascript 库，所以我使用 webpack 和 npm 作为我的包。
我的问题是，我发现无法加载 MathJax。我尝试了以下方法:

import 'mathjax-full';
require('mathjax-full'); // << not the error itself
import MathJax from 'mathjax-full';

我得到的最烦人的错误是:

ReferenceError: require is not defined

我必须做一些明显错误的事情。错误消息来自 MathJax 内部。我也尝试过导入 requirejs ，正如一些论坛提到的某种“解决方法”。我得到的错误是当我运行 WebPack 时:

ERROR in ./node_modules/requirejs/bin/r.js 1:0
Module parse failed: Unexpected character '#' (1:0) 

有人在 WebPack 上成功使用 MathJax 吗？

Answer 1

我遇到了和你一样的问题，再加上一百万。 MathJax 真的不是 WebPack 友好的。
我对 Angular 的解决方案:

npm install --save mathjax

扩展 "scripts" angular.json 的数组和:

"node_modules/mathjax/es5/tex-mml-chtml.js"

现在调用 MathJax API，不要使用 import任何形式的。 mathjax模块设置其 main至 es5/node-main.js ，它使用丑陋的 hack 来调用 require()在运行时，这是您看到的最终麻烦来源。
相反，请执行以下操作:

declare var MathJax;

现在你可能会提示这样你没有类型信息。好吧，事实是，甚至 mathjax-full具有此全局对象内方法的良好类型信息:它们在运行时注入(inject)方法(例如 MathJax.typeset() )，并且它们的类型使用 [name: string]: any; 声明.
如果您真的想要类型信息，您最好自己声明它，例如:

declare interface MathJaxGlobal {
  typeset(elems: HTMLElement[]);
}
declare var MathJax: MathJaxGlobal;