安装插件
代码语言：txt复制npm install --save gatsby-transformer-remark gatsby-remark-highlight-code @deckdeckgo/highlight-code配置插件
在 gatsby-config.js 中添加：
代码语言：txt复制// In your gatsby-config.js
plugins: [
{
resolve: `gatsby-transformer-remark`,
options: {
plugins: [
{
resolve: `gatsby-remark-highlight-code`
},
],
},
},
]运行时加载插件
对于 gatsby-starter-blog，在 src/templates/blog-post.js 的 BlogPostTemplate 类中添加：
代码语言：txt复制async componentDidMount() {
try {
const deckdeckgoHighlightCodeLoader = require("@deckdeckgo/highlight-code/dist/loader")
await deckdeckgoHighlightCodeLoader.defineCustomElements(window);
} catch (err) {
console.error(err);
}
}一般网站中在 index.js 中添加上述代码。
效果：https://aping-dev.com/gatsby-highlight-code/
image.png参考
gatsby-remark-highlight-code
