如何使用react syntax highlighter组件高亮代码

1、首先，使用npm add react-syntax-highlighter命令在项目中添加该程序包。

2、接着，打开package.json，就可以看到添加的react-syntax-highlighter以及版本。

3、在项目中，需要使用该组件的地方，使用如图命令导入Prism和需要的样式。然后就可以使用如图代码使用了。

4、在网页上的显示效果如图所示，可以看到设定Prism的language属性为json后，代码按照json高亮了。

5、也可以引入其它的样式，若干支持的样式如图所示，其中还有atomDark。

6、如图是切换另一个样式之后，json内容的代码高亮效果。