I've recently attempted to setup tags on my blog posts I'm attempting to create a page as detailed in the docs to be able to see posts with various tags. I've setup a template using src/templates/Tag.vue and updated my gridsome.server.js file as suggested:
api.loadSource((actions) => {
const posts = actions.addCollection("Post");
const tags = actions.addCollection("Tag");
// makes all ids in the `tags` field reference a `Tag`
posts.addReference("tags", "Tag");
tags.addNode({
id: "1",
title: "The author",
});
posts.addNode({
id: "1",
title: "A post",
tags: ["1"],
});
});
but how do I actually create that page? Do I need ot setup it up my config file to create it? Or do I setup a single file component? I don't understand and the docs aren't clear it seems as though it's missing a step or am I misunderstanding? Has anyone done this if so what am I missing? I am referencing the tags under the posts in my config.
{
use: "@gridsome/source-filesystem",
options: {
typeName: "Post",
path: "content/posts/**/*.md",
refs: {
// Creates a GraphQL collection from 'tags' in front-matter and adds a reference.
tags: {
typeName: "Tag",
create: true,
},
},
},
},
Any help appreciated.
If similar to Gatsby, it is possible to avoid using GraphQL.
Also, you can use template instead of page.