gatsby-remark-vscode not displaying correct color theme
jon424 opened this issue · comments
I'm trying to format code blocks in markdown files for posts to a website with Gatsby.
I would like the code blocks to be displayed in one of VSCode's color themes (Dark +, for instance). I have npm installed gatsby-remark-vscode, and put the plugin in my gatsby-config.js file:
plugins: [
{
resolve: 'gatsby-transformer-remark',
options: {
plugins: [{
resolve: 'gatsby-remark-vscode',
options: {
colorTheme: 'Dark+ (default dark)',
injectStyles: true,
extensions: [{
identifier: 'sdras.night-owl',
version: '1.1.3'
}],
extensionDataDirectory:
path.resolve('extensions'),
logLevel: 'error'
}
}]
}
},
]
I have required 'path' at the top of my gatsby-config.js file:
const path = require('path');
I have imported the stylesheet in my gatsby-browser.js file:
import 'gatsby-remark-vscode/styles.css';
I have used back-ticks to format in my markdown file (the file that contains the blog post) like this: ```js (CODE EXAMPLE) ```
When I npm run develop, I do not see the correct VSCode formatting for the code block, just a code block similar to what we see on StackOverflow code blocks. I would greatly appreciate any advice on how to render the correct theme in my code blocks.
You’re using plugin options from v1. Make sure you've installed v2 and have a look at the README for the current configuration options.
Thanks so much - I updated the version and edited the gatsby-config.js as stated in the README, and that fixes it.