vmware-clarity / Angular4中的代码突出显示无效

Question

所以我尝试在我的角度项目中使用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中的scripts元素。无济于事。

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

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

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