如何使用PrismJS突出显示React tsx



我有这个html文件:

<!DOCTYPE html>
<html>
<head>
<title>Test PrismJS</title>
<meta charset="utf-8" />
<link rel="stylesheet" href="prism/prism-onedark.css">
</head>
<body>
<pre><code class="language-tsx">
// Display some tsx:
<SocketProvider url={`ws://${apiServer}/...`}>
<Stats />
</SocketProvider>
</code></pre>
<script type="text/javascript" src="prism/prism.js"></script>
</body>
</html>

它应该显示高亮显示的代码,但所有的组件标签都被删除了,我只有一条评论:

// Display some tsx:

请帮忙。

易于修复。下载prism.js时,只需确保包含Unescaped Markup插件,并将代码封装在html注释中,如下所示:

<pre><code class="language-tsx"><!--
// Display some tsx:
<SocketProvider url={`ws://${apiServer}/...`}>
<Stats />
</SocketProvider>
--></code></pre>

相关内容

  • 没有找到相关文章

最新更新