如何正确使用PrismJS及其带有类型标/角2的类型
我正在用angular构建一个小应用程序，我想使用PrismJS，但我无法让它工作。
因此，基本上，我已经创建了一个供应商文件夹，我将棱镜的脚本和样式放在index.html中加载。
为了能够编译我的应用程序，我还需要安装类型定义：
npm i --save-dev @typings/prismjs然后，我只需在代码中的任何地方调用Prism.whatever()，但这是行不通的。
甚至连我的IDE都不识别名称空间Prism。
通过检查定义(index.d.ts)的内容，我看到自版本1.6以来，它不包含
declare var Prism : PrismJS.Prism;更多。只有一些export namespace Prism。因此，我想知道是否需要导入一些东西，因为使用了任何declare。
在我看来，从定义文件中导入一些东西似乎很奇怪。
由于我想进一步解决这个问题，我已经安装了一个旧版本的定义(1.4.16)，其中包含
declare var Prism : PrismJS.Prism;现在，我的IDE (网络风暴)是快乐的！它可以识别Prism。但是当我试图编译时，webpack仍然输出一个错误：
Cannot find name 'Prism'所以我的问题很基本:我忘记了什么？
很抱歉问了这个明显的问题。
谢谢!
回答 4
Stack Overflow用户
发布于 2017-06-20 16:16:47
在角-cli中添加像这样的prism.js：
"scripts": [
"../node_modules/prismjs/prism.js"
],在那之后，你可以让打字本满意
declare var Prism;然后像那样使用它
<code [innerHtml]="myCode"></code>
ngAfterViewInit() {
const code = 'var data = 1;';
this.myCode = Prism.highlight(code, Prism.languages.javascript);
}Stack Overflow用户
发布于 2017-06-26 12:57:55
我觉得你做了-
npm install prismjs -Snpm install @types/prismjs -D
现在您需要将它导入n个组件，作为-
import * as prism from 'prismjs';然后使用棱镜js支持的prism.whatEverMethod()。
Stack Overflow用户
发布于 2020-04-03 11:06:50
我想扩展以前的答案，除了默认的语言之外，我还可以使用其他语言。首先，用npm i prismjs安装棱镜。
在您的angular.json中添加：
"scripts": [
"../node_modules/prismjs/prism.js"
]在组件中导入必要的语言：
import 'prismjs';
import 'prismjs/components/prism-css';
import 'prismjs/components/prism-javascript';
// ...you can import further languages aswell
declare var Prism: any;有关所有可用语言，请参见这里。
最后，应用突出显示的代码：
code: string = 'helloWorld() { console.log("hello world"); }';
languageIdentifier: string = 'typescript';
ngOnInit() {
this.code = Prism.highlight(this.code, Prism.languages[this.languageIdentifier]);
}在模板中：
<code [innerHtml]="code"></code>https://stackoverflow.com/questions/44506673
复制相似问题
腾讯云开发者
