gatsby-yaml-full-markdown
v5.0.1
Published
Markdown to HTML conversion using !markdown tag
Downloads
1,000
Maintainers
Readme
gatsby-yaml-full-markdown
Plugin for gatsby-transformer-yaml-full
to enable Markdown to HTML conversion
using !markdown
tag. The conversion is handled by remark.
Installation
npm install gatsby-yaml-full-markdown gatsby-transformer-yaml-full
Usage
/* gatsby-config.js */
module.exports = {
plugins: [
{
resolve: 'gatsby-transformer-yaml-full',
options: {
plugins: [
{
resolve: 'gatsby-yaml-full-markdown',
options: {
/* gatsby-yaml-full-markdown options here */
}
}
],
},
}
// ...
],
}
Example
Note: this plugin accepts a string or a file path input; if a file is detected, the plugin will read it and return the processed data.
The following ./post.yaml
and ./file.md
files, respectively:
---
title: Blog post
content: !markdown |
## Heading
Article content.
file: !markdown file.md
# Title
File content.
Will return:
{
data: {
postYaml: {
title: 'Blog post',
content: {
html: '<h2>Heading</h2>\n<p>Article content.</p>\n',
plain: 'Heading\n\nArticle content.\n'
},
file: {
html: '<h1>Title</h1>\n<p>File content.</p>\n',
plain: 'Title\n\nFile content.\n'
}
}
}
}
With the following query:
query {
postYaml {
title
content
file
}
}
Options
remarkHtml
Type: object
. Default: {}
.
remark-html
can be configured through remarkHtml
option — i.e. if you want
to allow dangerous raw HTML in the output, set the sanitize
option to false
.
More info about remark-html
options can be found here.