Рефакторинг файла gatsby-node в отдельные файлы не работает

Question

Попытка рефакторинга моего gatsby-node файла путем аутсорсинга небольшого количества кода. Прямо сейчас, пытаясь сделать это в моем gatsby-node:

const createBlogPostPages = require("./gatsby-utils/createBlogPostPages");

exports.createPages = async ({ actions, graphql, reporter }) => {
  //...some code
  await createBlogPostPages({ actions, graphql, reporter });
  //...some code
}

и мой createBlogPostPages, который находится в другом файле, выглядит так:

const path = require("path");

module.exports = async function({ actions, graphql, reporter }) {
  const { createPage } = actions;

  const blogArticles = await graphql(`
    {
      allMdx(filter: { fileAbsolutePath: { regex: "/content/blog/.*/" } }) {
        edges {
          node {
            id
            fileAbsolutePath
            fields {
              slug
            }
            frontmatter {
              title
              tags
              date
              tagline
            }
          }
        }
      }
    }
  `);

  blogArticles.data.allMdx.edges.forEach(({ node }) => {
    let imageFileName = ... //some stuff

    createPage({
      path: `${node.fields.slug}`,
      component: path.resolve(`./src/templates/blog-post.js`),
      context: {
        slug: `${node.fields.slug}`,
        id: node.id,
        imageFileName: imageFileName
      }
    });
  });
};

Все это работает, когда его прямо в gatsby-node. Однако, переместив вещи, я теперь получаю:

"gatsby- node.js" выдал ошибку при запуске жизненного цикла createPages:

blogArticles не определен

ReferenceError: blogArticles не определена

• gatsby- node.js: 177 Object.exports.createPages / Users / kohlisch / blogproject / gatsby- node.js: 177: 19

• next_tick. js: 68 process._tickОтзыв внутренний / process / next_tick. js: 68: 7

Так выглядит как будто он не ждет разрешения запроса graphql? Или что это может быть? Я просто хочу переместить несколько вещей из моего gatsby-node файла в отдельные функции, чтобы он не был перегружен. Разве это не возможно?

Answer 1

При импорте в gatsby-node.js необходимо соблюдать два правила:

1. Используйте node.js требуемый синтаксис.

./src/components/util/gatsby-node-functions

const importedFunction = () => {
  return Date.now();
};

module.exports.importedFunction = importedFunction;

gatsby-node.js

const { importedFunction } = require(`./src/components/util/gatsby-node-functions`);

// ...
// Use your imported functions
console.log(importedFunction());

Ссылка: Выпуск репозитория Gatsby , также включает в себя хак, как использовать оператор импорта ES6, если вы хотите добавить сложность только для использования оператора импорта.

2. Не передавайте атрибуты gatsby-node.js конкретный c импортированным функциям

Если вы попытаетесь, например, передать на аутсорсинг функцию createPages, действия будут неопределенными:

const importedFunction = (actions, node) => {
    const {createPage} = actions; // actions is undefined
    createPage({
      path: `${node.fields.slug}`,
      component: path.resolve(`./src/templates/blog-post.js`),
      context: {
        slug: `${node.fields.slug}`,
        id: node.id,
      }
    });
};

module.exports.importedFunction = importedFunction;

Не стесняйтесь размышляйте, почему вы не можете передать атрибуты. В документации Gatsby упоминается "Redux" для обработки состояния. Возможно, Redux не поставляет данные за пределы вашего gatsby-node.js. Поправь меня если я не прав