Description
This plugin uses shiki to add code highlighting to pages that are built with gatsby-transformer-remark.
How to install
npm install gatsby-remark-shiki
When do I use this plugin?
You need it to highlight code blocks (```) in your markdown files. You can use many popular themes that are available in IDEs like VSCode, e.g. Nord.
Examples of usage
Simple
// In your gatsby-config.js
plugins: [
{
resolve: `gatsby-transformer-remark`,
options: {
plugins: [
{
resolve: `gatsby-remark-shiki`,
options: {
theme: 'nord', // Default
},
},
],
},
},
];Add your own TextMate language
// In your gatsby-config.js
plugins: [
{
resolve: `gatsby-transformer-remark`,
options: {
plugins: [
{
resolve: `gatsby-remark-shiki`,
options: {
langs: [
{
id: `wowlang`,
scopeName: `source.wowlang`,
path: cwd_join(`langs/wowlang.tmLanguage.json`),
},
],
},
},
],
},
},
];How to contribute
Feel free to file an issue here: https://github.com/jlkiri/gatsby-remark-shiki/issues