如何使用React.js以某种方式在html中显示代码块

Question

我希望在我的反应应用程序中显示代码块，就像它们在反应路由器网站页面中一样（相同的配色方案）。我将如何实现这一目标，我尝试从谷歌改进，但我一直收到错误，因为我使用React.js。

这是反应路由器网站，（我希望我的代码如何显示，相同的样式/颜色）：https://reacttraining.com/react-router/web/guides/quick-start

Answer 1

您正在寻找的是Syntax Highlighting。在ReactJS中，有几种方法可以实现这样的目标：

1. 使用syntax highlighting library from NPM。我自己并没有真正使用过这些，但是看到这是编程领域的共同需求，我毫不怀疑这些解决方案中的一个可以很好地适用于你正在尝试做的事情，只需稍微调整一下

2. 使用markdown editor library from NPM。如果你需要一些客户端（即代码编辑器），那里有很多用户友好的解决方案可以很好地插入React。

3. 自己构建。您可以考虑采用一种方法来创建特定于您的需求的markdown编辑器。这将是一个学习操作输入的基础知识的好方法。

祝你好运！