Question

不确定为什么无法创建此页面...

我将markdown用作具有以下内容的内容源：

---
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.

Markdown文件位于各种源文件夹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

盖茨比“内部数据桥”返回错误？圆形结构？

0 个答案: