highlight

文档

highlight

highlightjs
Github

prism

prism
Github

示例

/**
 * @desc: 以 json 为例 
*/
import React, { useState, useRef, useEffect } from 'react';
import hljs from 'highlight.js/lib/highlight';
import json from 'highlight.js/lib/languages/json';
import 'highlight.js/styles/github.css';
hljs.registerLanguage('json', json);
function HighLightCode({ text }) {
  const [codeInts] = useState(useRef(null));
  useEffect(() => {
    if (codeInts.current) {
        hljs.highlightBlock(codeInts.current);
    }
    return () => {};
  }, [codeInts]);
    return (
      <code ref={codeInts}>{text}</code>
  );
}
export default HighLightCode;

更多参考

CodeMirror

CodeMirror
Github