前言
react-diff-viewer 是一個很好的 diff 展示庫，但是也有一些坑點和不完善的地方，本文旨在描述如何在這個庫中實現自定義語法高亮。
Syntax highlighting is a bit tricky when combined with diff. Here, React Diff Viewer provides a simple render prop API to handle syntax highlighting. Use renderContent(content: string) => JSX.Element and your favorite syntax highlighting library to achieve this.
倉庫地址：https://github.com/praneshr/react-diff-viewer
問題
issue 地址：https://github.com/praneshr/react-diff-viewer/issues/182
如果只是直接引入這個庫，你會發現沒有代碼的語法高亮，看起來會十分難受
于是乎，你按照文檔引入了，發現樣式會被覆蓋掉，兩種樣式共存會很難看，如下：
解決方案
這個問題發生的原因是因為你自定義的渲染器覆蓋了原有樣式，只需要把你自定義的渲染屬性移除就行，比如 customStyle={{ display: ‘inline’, padding: 0, background: ‘none’ }}
完美高效解決問題！
