gatsby-transformer-javascript-frontmatter
Parses Stories files to extract content.
Install
npm install --save-dev @kamila-lab/story-loader
How to use
To use this plugin you also need gatsby-source-filesystem installed and configured.
// In your gatsby-config.js
module.exports = {
plugins: [
{
resolve: `gatsby-source-filesystem`,
options: {
path: `./.stories/`
}
},
"@kamila-lab/story-loader"
]
};
Parsing algorithm
In a index.story.js
(or index.story.jsx
/ index.story.ts
/ index.story.tsx
) file.
export default {
name: "Sorting",
summary: "",
code: `<Icon icon="icon icon-switch"/>`
};
How to query
You'd be able to query your frontmatter like:
{
allStories {
nodes {
story {
code
component
name
summary
}
}
}
}
Which would return something like:
{
"data": {
"allStories": {
"nodes": [
"story": {
"component": {
"code": `<Icon icon="icon icon-switch"/>`,
"name":"Sorting",
"summary":""
}
}
]
}
}
}