Reactjs 在试图在gatsby节点中创建页面时,我收到了此生成错误
这是该文件中的所有代码。我找到了这个链接,但删除getNode似乎没有帮助。在路径插件中,是这个斜杠。我在console.log时注意到路径未定义,但我不知道该怎么做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
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"
/>