Reactjs 在试图在gatsby节点中创建页面时,我收到了此生成错误

Reactjs 在试图在gatsby节点中创建页面时,我收到了此生成错误,reactjs,gatsby,Reactjs,Gatsby,这是该文件中的所有代码。我找到了这个链接,但删除getNode似乎没有帮助。在路径插件中,是这个斜杠。我在console.log时注意到路径未定义,但我不知道该怎么做 ERROR #11321 PLUGIN "gatsby-node.js" threw an error while running the onCreateNode lifecycle: Cannot read property 'replace' of undefined 25 | const { create

这是该文件中的所有代码。我找到了这个链接,但删除getNode似乎没有帮助。在路径插件中,是这个斜杠。我在console.log时注意到路径未定义,但我不知道该怎么做

 ERROR #11321  PLUGIN

"gatsby-node.js" threw an error while running the onCreateNode lifecycle:

Cannot read property 'replace' of undefined

  25 |   const { createNodeField } = actions;
  26 |   if (node.internal.type === 'MarkdownRemark') {
> 27 |     const slug = createFilePath({ node, getNode, basePath: 'content' });
     |                  ^
  28 |     createNodeField({
  29 |       node,
  30 |       name: 'slug',

File: gatsby-node.js:27:18



  TypeError: Cannot read property 'replace' of undefined

  - path.js:54 slash
    [netcreative0]/[gatsby-core-utils]/dist/path.js:54:15

  - create-file-path.js:41 module.exports
    [netcreative0]/[gatsby-source-filesystem]/create-file-path.js:41:61

  - gatsby-node.js:27 Object.exports.onCreateNode
    C:/code/netcreative0/gatsby-node.js:27:18

  - api-runner-node.js:247 runAPI
    [netcreative0]/[gatsby]/dist/utils/api-runner-node.js:247:41

  - api-runner-node.js:387 resolve
    [netcreative0]/[gatsby]/dist/utils/api-runner-node.js:387:13

  - new Promise

  - api-runner-node.js:386 runPlugin
    [netcreative0]/[gatsby]/dist/utils/api-runner-node.js:386:10

  - api-runner-node.js:340 module.exports
    [netcreative0]/[gatsby]/dist/utils/api-runner-node.js:340:24

  - next_tick.js:68 process._tickCallback
    internal/process/next_tick.js:68:7
我的代码的后半部分如下所示:

**function slash(path) {
  const isExtendedLengthPath = /^\\\\\?\\/.test(path);

  if (isExtendedLengthPath) {
    return path;
  }

  return  path.replace(/\\/g, `/`);
}**

const path = require('path');
const DirectoryNamedWebpackPlugin = require('directory-named-webpack-plugin');
const { createFilePath } = require('gatsby-source-filesystem');

exports.onCreateWebpackConfig = ({
  stage,
  getConfig,
  rules,
  loaders,
  actions,
}) => {
  actions.setWebpackConfig({
    resolve: {
      modules: [path.resolve(__dirname, 'src'), 'node_modules'],
      plugins: [
        new DirectoryNamedWebpackPlugin({
          exclude: /node_modules/,
        }),
      ],
    },
  });
};

exports.onCreateNode = ({ node, getNode, actions }) => {
  const { createNodeField } = actions
  if (node.internal.type === 'MarkdownRemark') {
    const slug = createFilePath({ node, getNode, basePath: 'slugs' });
    console.log(slug);
    createNodeField({
      node,
      name: `slug`,
      value: slug,
    });
  }
};
最后一个字段为null并引发错误。不知道为什么会在那里?我可以很容易地把一个条件,但什么是默认的?有什么建议吗?见下文

exports.createPages = async ({ graphql, actions }) => {
  const { createPage } = actions;
  const result = await graphql(`
    query {
      allMarkdownRemark {
        edges {
          node {
            fields {
              slug
            }
          }
        }
      }
    }
  `)
  result.data.allMarkdownRemark.edges.forEach(({ node }) => {
    console.log(node)
    createPage({
      path: node.fields ? node.fields.slug : '',
      component: path.resolve(`./src/template/project.js`),
      context: {
        // Data passed to context is available
        // in page queries as GraphQL variables.
        slug: node.fields ? node.fields.slug : '',
      },
    })
  });
}

在删除了contentful插件之后,我看到了一条更有用的错误消息。 创建新页面时,.md文件中缺少一些图像,因此“我的模板”页面中的这一行出现错误

{ fields: { slug: '/about/content/' } }
{ fields: { slug: '/home/intro/' } }
{ fields: { slug: '/slugs/goldparent/' } }
{ fields: { slug: '/slugs/ipadmaster/' } }
{ fields: null }

data.frontmatter.featuredImage.childImageSharp.fluid
无法读取未定义的属性“replace”。
-看起来像。replace正在未定义的值上使用。你能显示更多的代码吗,例如,你是否在使用.replace anywhere?我没有,不。我也找不到它可能在其他地方。
data.frontmatter.featuredImage.childImageSharp.fluid <-
<Img
          style={{ width: '70%' }}
          fluid={
            data.frontmatter.featuredImage
              ? data.frontmatter.featuredImage.childImageSharp.fluid
              : {}
          }
          alt="Large Image"
        />