半熟前端

軟體工程師 / 台灣人 / 在前端的路上一邊探索其他領域的可能性

本部落格使用 Gatsby 製作

本部落格有使用 Google Analytic 及 Cookie

雜談

從 prismjs 改為 shiki

從 prismjs 改為 shiki

shiki 是一個將程式碼語法做高亮的套件,跟其他套件(highlightjs, prismjs)算是比較新一些,也比較少人知道。shiki 是用 TextMate grammar 當作 tokenizer 的定義,除了可以從其他地方直接拿來用不需要再另外撰寫客製化語言之外,有統一的標準之後要擴充也比較容易。 另外則是它支援的語法很豐富也比較好設定,內建的主題也很多,就順手把原本的 prismjs 換掉了。安裝 gatsby-remark-shiki 再把設定套上去就搞定了,讚讚。

遇到一些小問題:

  • 原本用 react 的 highlight,要全部改成 jsx 或是 tsx
  • 如果是用 c++,要改成 cpp

看看成果:

jsx
const Component = () => <MyComponent />

如果覺得這篇文章對你有幫助的話,可以考慮到下面的連結請我喝一杯 ☕️
可以讓我平凡的一天變得閃閃發光 ✨

Buy me a coffee