angular - vmware-clarity/Angular4 中的代码高亮显示不起作用

Question

因此，我尝试在我的 Angular 项目中使用 VMware Clarity 项目中的 Code Highlight。但我没有成功实施它。

我根据文档将这些行添加到我的 index.html 中。但这只会给我错误。

<link rel="stylesheet" href="node_modules/prismjs/themes/prism-solarizedlight.css">
<script src="node_modules/prismjs/prism.js"></script>
<script src="node_modules/prismjs/components/prism-typescript.min.js"></script>

然后我尝试将它添加到 angular.cli 中的脚本元素中。无济于事。

由于缺乏文档和答案，我有点迷失了下一步该做什么。

[编辑] 我确实用 npm 安装了 prismjs。

Answer 1

您需要添加样式表和脚本angular-cli.json

...
"styles": [
    ...
    "../node_modules/clarity-ui/clarity-ui.min.css",
    "../node_modules/prismjs/themes/prism-solarizedlight.css",
    ...
],
"scripts": [
    ...  
    "../node_modules/prismjs/prism.js",
    "../node_modules/prismjs/components/prism-typescript.min.js",
    ...
],
...

有关详细信息，请参阅此文件： https ://github.com/vmware/clarity/blob/new-website/angular-cli.json#L19