Shiki — A beautiful Syntax Highlighter
octref · octref · 2019-01-04 13:41:32 +08:00 · 2574 次点击这是一个创建于 2148 天前的主题，其中的信息可能已经有所发展或是发生改变。
Shiki
- Demo: http://shiki.matsu.io
- GitHub: https://github.com/octref/shiki
VS Code / 旧版 Atom / Sublime Text / TextMate 使用的都是 Oniguruma 和 TextMate grammar 來做 syntax highlighting。在各种 API 文档以及博客上，大家现在使用的一般是 Highlight.js 或者 Prism.js ，但它们的缺点是：
- 无法达到 TextMate grammar + TextMate theme 高亮的准确性。
- 无法使用 VS Code 的 theme。
最近有人把 Oniguruma 编译成 WASM，于是就基于这个做了一个 Syntax Highlighter。
- 支持各种常用语言。
- 支持所有 VS Code theme。
- 已经用于 VS Code 的官方 API 文档，比如 https://code.visualstudio.com/api/extension-guides/command
- 正在和 TypeScript team 建议使用于 TS 的 docs / handbook。这里是用 Vuepress 和 vuepress-plugin-shiki 做的两个 Tutorial 的预览： https://shiki-ts-handbook.netlify.com 。
各位可以试试用于自己的 static site generator。
GitHub 欢迎 star / feature-request / issue。
TS Handbook in Material Theme:
 |
1
MartinWu 2019-01-04 13:50:24 +08:00
vscode 用户表示，我可以怎么用这个东西？
|
 |
2
octref OP @MartinWu
- `yarn add shiki` - 按 demo 或者 GitHub 里的例子运行，比如: ```js const shiki = require('shiki') shiki.getHighlighter({ theme: 'nord' }).then(highlighter => { console.log(highlighter.codeToHtml(`console.log('shiki');`, 'js')) }) ``` |
 |
4
aaronly 2019-01-04 14:09:37 +08:00
nice, 关注了
|
Select Language