Не знаю, почему это создание страницы не работает ...
Я использую markdown в качестве источника контента с frontmatter, который выглядит следующим образом:
---
title: Auth using OAuth2
date: "2018-07-05"
section: blog
cover_image: "./authentication-using-oauth.jpg"
tags: ["oauth2", "api", "laravel", "react"]
draft: false
categories: ["Design"]
---
Some great content.
Файлы разметки находятся в различныхисходные папки blog, work, writing, tips
.
Цель состоит в том, чтобы иметь такие маршруты, как:
/tags/
/tags/cool/
/blog/tags/
/blog/tags/cool/
/work/tags/
/work/tags/cool/
etc...
Я пытаюсь создать страницы тегов и категорий, используя одну универсальную функцию, которая выглядит следующим образом с учетом дополнительныхКлассификации могут быть добавлены позже, и это хорошо и чисто, как есть:
const createCollectionPages = (edges, createPage, collectionName, listTemplate, detailTemplate) => {
const nodesByCollectionBySource = {}
nodesByCollectionBySource.all = {}
edges.forEach(({ node }) => {
sourceName = node.fields.sourceName
if (!nodesByCollectionBySource[sourceName]) {
nodesByCollectionBySource[sourceName] = {}
}
const collectionsArray = eval(`node.frontmatter.${collectionName}`)
if (collectionsArray) {
collectionsArray.forEach(collection => {
if (!nodesByCollectionBySource.all[collection]) {
nodesByCollectionBySource.all[collection] = []
}
nodesByCollectionBySource.all[collection].push(node)
if (!nodesByCollectionBySource[sourceName][collection]) {
nodesByCollectionBySource[sourceName][collection] = []
}
nodesByCollectionBySource[sourceName][collection].push(node)
})
}
})
Object.entries(nodesByCollectionBySource).forEach(entry => {
const [sourceName, collectionsForSource] = entry
// COLLECTION NAMES
const collections = Object.keys(collectionsForSource)
// COLLECTION LIST PAGES (one for each sourceName)
const collectionsPath = sourceName == 'all' ? `/${collectionName}` : `/${sourceName}/${collectionName}`
createPage({
path: collectionsPath,
component: listTemplate,
context: {
pathSlug: path,
collectionName,
collections: collections.sort(),
sourceName,
},
})
collections.map((collection, index) => {
const edges = collectionsForSource[collection]
const path =
sourceName == 'all'
? `/${collectionName}/${_.kebabCase(collection)}`
: `/${sourceName}/${collectionName}/${_.kebabCase(collection)}`
createPage({
path,
component: detailTemplate,
context: {
pathSlug: path,
collectionName,
edges,
collection,
sourceName,
},
})
})
})
}
Мои gatsby-node.js
Соответствующие биты:
const wrapper = promise =>
promise.then(result => {
if (result.errors) {
throw result.errors
}
return result
})
exports.createPages = async ({ graphql, actions }) => {
const { createPage } = actions
const result = await wrapper(
graphql(`
{
${gatsbyNodeGraphQL}
}
`)
)
createPostDetailPages(result.data.workIndexPages.edges, createPage, path.resolve('./src/templates/work-detail.js'))
createPostDetailPages(result.data.blogIndexPages.edges, createPage, path.resolve('./src/templates/work-detail.js'))
createCollectionPages(
result.data.blogIndexPages.edges,
createPage,
'categories',
path.resolve('./src/templates/collection-list.js'),
path.resolve('./src/templates/collection-detail.js')
)
}
НЕПРАВДАЛЬНО ...
error Plugin internal-data-bridge returned an error
TypeError: Converting circular structure to JSON
- JSON.stringify