Как мне изменить заголовок поста Гэтсби?

Мне довелось изменить способ gatsby-transformer-remark модифицировать frontmatter, и это напомнило мне этот вопрос. То, как вы это сделали, прекрасно, я думаю, я просто хочу предоставить другой вариант. Вот как вы можете переопределить frontmatter:

Внутренне, gatsby-transformer-remark использовать graymatter для анализа frontmatter уценки (трактуя md как yaml). Мы можем изменить поведение парсера по умолчанию Graymatter, чтобы напрямую переопределить frontmatter.

// should come with `gatsby-transformer-remark` by default
// if it's missing, install it `yarn add js-yaml`
const yaml = require('js-yaml');

const customParser = (str) => {
  const result = yaml.safeLoad(str);

  // modify `title`. In Gatsby, `title` is guaranteed to exist,
  // but you might want to add a check for other properties.
  if (result.title) {
    result.title = result.title.toUpperCase();
  }
  return result;
}

А затем передать его в gatsby-transformer-remark, как

{
  resolve: `gatsby-transformer-remark`,
  options: {
+   engines: {
+     yaml: customParser,
+   },
    plugins: [
      ...
    ],
  },
},

Результаты запроса Гэтсби:

{
  "data": {
    "markdownRemark": {
      "frontmatter": {
        "title": "I AM CAPITALIZED"
      }
    }
  }
}

Я нашел решение, которое я считаю взломанным. Frontmatter может быть переопределен во время создания узла onCreateNode путем обновления узла, прежде чем он будет передан в массив узлов. Я использую массив postNodes (глобальный массив для контекста узла Гэтсби) для создания страниц моего блога.

createNodeField({ node, name: "slug", value: slug })
node.frontmatter.title = _.startCase(_.toLower(node.frontmatter.title))
postNodes.push(node)

Затем, когда создаются страницы сообщений exports.createPages, используются postNodes, которые имеют обновленные значения.

    let idx = 0;
    postNodes.map(node => {
      let previous = idx - 1 < 0 ? postNodes[postNodes.length - 1] : postNodes[idx - 1]
      let next = idx + 1 >= postNodes.length ? postNodes[0] : postNodes[idx + 1]

      createPage({
        path: node.fields.slug,
        component: postPage,
        context: {
          slug: node.fields.slug,
          prev: previous.fields.slug,
          next: next.fields.slug
        }
      })
      idx += 1;
    })

Примечание Предыдущая и следующая не работали на момент написания этого кода, поэтому его необходимо пересмотреть.