garden webpack plugin (or, bidirectional linking)
September 6, 2020
documenting process of creating webpack plugin
getStaticProps
is really great at generating pages from static data, but I also need some way to track relations between static files. If Post A mentions Post B, I want to display that relation on Post B. While this could happen in the getStaticProps
function, it doesn't make sense to run through the whole file system to surface that relation. Instead, I want to generate a static map at build time and just reference that.
initial implementation
- get all
.mdx
files - parse and get array of all links
- map garden
garden = [
{
post: ${postTitle},
id: uuid,
order: ${postDate}, // ordered chronologically
mentions: [] // array of links
}
]
- map back over
garden
to insertmentionedIn
array
garden = [
{
...postInfo,
mentionedIn: [] // array of posts that mention this post
}
]
- export garden as a static file so it's available to
getStaticProps