让 MathJax 处理 Angular cli 项目

Question

我希望能够在我的 @angular/cli 项目中使用 MathJax。我以前有一个使用 systemjs 的 Angular 2 项目，这不是问题。然而，angular cli 切换到使用 webpack，我似乎无法让这个新项目工作。

我相信我已按照here 所述的所有说明进行了全局库安装，但我可能误解了某些内容。

我构建了一个代码库来展示正在发生的事情。可以看到here。

基本上，我所做的是安装 @angular/cli 并将 yarn 设置为其默认包管理器。

我开始这个项目

ng new math-bug

我安装了依赖项

yarn add express body-parser mathjax mongoose
yarn add @types\mathjax --dev

我修改了 .angular-cli.json 文件，将以下内容添加到脚本数组（之前为空）。

"../node_modules/mathjax/MathJax.js"

我在我的项目中添加了一个使用该行的组件：

"MathJax.Hub.Queue([ "Typeset", MathJax.Hub, this.id]);"

但是当我尝试使用 ng build 构建我的项目时，我收到以下错误： 当我构建我的项目时，我得到了错误：

ERROR in C:/Users/Pat/ProgrammingProjects/math-bug/src/app/latex/latex.component.ts (23,9): Cannot find name 'MathJax'.
C:/Users/Pat/ProgrammingProjects/math-bug/src/app/latex/latex.component.ts (23,40): Cannot find name 'MathJax'.

如果有帮助，请提供额外信息 - 我在 Windows 10 上运行它，当我运行 ng --version 时，输出如下：

@angular/cli: 1.0.0
node: 7.2.1
os: win32 x64
@angular/common: 4.0.1
@angular/compiler: 4.0.1
@angular/core: 4.0.1
@angular/forms: 4.0.1
@angular/http: 4.0.1
@angular/material: 2.0.0-beta.2
@angular/platform-browser: 4.0.1
@angular/platform-browser-dynamic: 4.0.1
@angular/router: 4.0.1
@angular/cli: 1.0.0
@angular/compiler-cli: 4.0.1

Answer 1

在src/tsconfig.app.json 中添加mathjax 到types 如下：

"types": ["mathjax"]

如果您还打算使用 mathjax 进行测试，请将相同的内容添加到 src/tsconfig.spec.json

阅读这里types:https://www.typescriptlang.org/docs/handbook/tsconfig-json.html#types-typeroots-and-types