Как определить пути к страницам уценки Gatsby в одном файле?

По умолчанию Gatsby использует frontmatter для определения путей, например:

---
path: /example-page
---

а затем работает с ним через GraphQL.

Как лучше всего определить эти пути для всех файлов уценки, не записывая переднюю часть в каждом файле, а в одном файле, например, например:

[
    {
        "title": "Example",
        "path": "/example-page.md"
    }
]

person Dmitry Samoylenko    schedule 05.06.2018    source источник


Ответы (1)


Вы можете сделать это, добавив путь при создании страницы.

Добавьте это в gatsby-node:

const { createFilePath } = require(`gatsby-source-filesystem`);

exports.onCreateNode = ({ node, getNode, boundActionCreators }) => {

  const { createNodeField } = boundActionCreators

  if (node.internal.type === `MarkdownRemark`) {

    const slug = createFilePath({
      node,
      getNode,
      basePath: `pages`
    })

    createNodeField({
      node,
      name: `slug`,
      value: `/pages${slug}`
    })

  }

};

createFilePath превратить файлы уценки в pages каталоге в /pages/slug.

createNodeField создает новое поле для запроса с именем slug.

Теперь в graphql вы можете получить доступ к слагу:

{
  allMarkdownRemark {
    edges {
      node {
        fields {
          slug
        }
      }
    }
  }
}

Затем вы можете создавать свои страницы как обычно, используя новое поле заголовка в качестве пути к странице.

При этом вы можете добавить свой заголовок и все, что хотите, в данные, доступные в graphql.

Пример здесь: https://www.gatsbyjs.org/tutorial/part-seven/

person anthowelc    schedule 05.06.2018