TE
科技回声
首页24小时热榜最新最佳问答展示工作
GitHubTwitter
首页

科技回声

基于 Next.js 构建的科技新闻平台,提供全球科技新闻和讨论内容。

GitHubTwitter

首页

首页最新最佳问答展示工作

资源链接

HackerNews API原版 HackerNewsNext.js

© 2025 科技回声. 版权所有。

Syntax highlighting on the web

50 点作者 joelg大约 3 年前

5 条评论

eyelidlessness大约 3 年前
This is a good reminder that I need to extract and open source the Shiki integration stuff from my personal site. I doubt I fully addressed the limitations in the linked issue, as my usage is fully static (both build and runtime), but there are other parts people might find useful: mapping inline styles to unique generated class names for more generalized styling (currently depends on Fela for atomic classes, but can be generalized further), which also enables support for light&#x2F;dark mode without JS. Shiki is <i>fantastic</i>, but unfortunately still fairly obscure. Hopefully making it easier to adopt for more use cases will help.<p>I also agree that tree-sitter is a pain to use in web projects, but I’ll be open sourcing my solutions for that too (either as direct contributions to web-tree-sitter where appropriate, or as plugins for ecosystem tooling where I had to do additional work to support specific tools) as it’s part of ongoing, already open source project work.
alpaca128大约 3 年前
&gt; Also it&#x27;s written in Rust<p>The core library is in C.
ezekg大约 3 年前
I use Torchlight (<a href="https:&#x2F;&#x2F;torchlight.dev" rel="nofollow">https:&#x2F;&#x2F;torchlight.dev</a>) for syntax highlighting on a static site (<a href="https:&#x2F;&#x2F;keygen.sh" rel="nofollow">https:&#x2F;&#x2F;keygen.sh</a>) and it’s been great. I use Torchlight’s CLI to precompile the code snippets during the build step. Much better than highlighting client-side with JS.
nyanpasu64大约 3 年前
Out of curiosity, since this post discusses syntax highlighting on the web and supports code syntax highlighting, what blog engine does this site use? Does it support giving headings their own id (I use headings and like being able to refer to them with anchor URLs, but I didn&#x27;t see any headings on the entire blog)?
mklein994大约 3 年前
Seems similar to twoslash:<p><a href="https:&#x2F;&#x2F;shikijs.github.io&#x2F;twoslash&#x2F;" rel="nofollow">https:&#x2F;&#x2F;shikijs.github.io&#x2F;twoslash&#x2F;</a><p><a href="https:&#x2F;&#x2F;github.com&#x2F;shikijs&#x2F;twoslash" rel="nofollow">https:&#x2F;&#x2F;github.com&#x2F;shikijs&#x2F;twoslash</a>