记录react-syntax-highlighter代码块儿

安装

// npm
npm install react-syntax-highlighter --save
// yarn
yarn add react-syntax-highlighter

引入

import { Prism as SyntaxHighlighter } from 'react-syntax-highlighter';
import { dark } from 'react-syntax-highlighter/dist/esm/styles/prism';

应用

<SyntaxHighlighter
           language="json"         //你需要的类型，比如url、JavaScript等
           style={darcula}         //这个就是你代码高亮的样式，颜色类的
           showLineNumbers={true}  //这个是显示不显示左侧的行数
           lineNumberStyle={{color: '#ddd', fontSize: 20}}     //这个是行数的样式
           wrapLines={true}        //确定每行代码是否应该包装在父元素中
>
           {sItem.code}          //代码块儿内容
</SyntaxHighlighter>

参考文档：
链接: https://github.com/conorhastings/react-syntax-highlighter.