开发者问题收集

NextJs 渲染错误

2020-04-03
5239

我在尝试使用“纱线构建”构建页面时会收到以下错误我的所有文件和任何页面中都没有任何pho.md或任何其他列出的项目提及。对可能导致这些错误的原因有任何想法吗?

文件结构

112358897

完整getstaticprops

526975958

新错误

092262264

代码如下

7652222368
1个回答

以下是简化的代码。保持 glob 不变,它似乎工作正常。问题在于如何解析列表中的名称。

在此代码片段中,您将看到代码中的 blogSlugs 问题以及作为解决方案的 newBlogSlugs

newBlogSlugs 代码有什么作用?

file.replace(/^.*[\\\/]/, '').split('.')[0]

Replace 方法替换除最后一个之外的所有路径部分,我们得到“cupcakes.md”。然后我们在点上拆分字符串并仅使用第一部分,得到“cupcakes”。

// This represent the output of your glob function. You don't nee to copy the list. That is just for clarity on how the blogs array looks.
const blogs = [
  "src/markdown/posts/cupcakes.md",
  "src/markdown/posts/cat-stuff.md"
];

// This is your blogSlugs contstant
const blogSlugs = blogs.map(file =>
  file
    .split('/')[2]
    .replace(/ /g, '-')
    .slice(0, -3)
    .trim()
)

// This is the new solution that you should use instead of your blogSlugs
// !!! UPDATED HERE
const newBlogSlugs = blogs.map(file => file.replace(/^.*[\\\/]/, '').split('.')[0]);

console.log("Original", blogSlugs);
console.log("Fixed", newBlogSlugs);

编辑:提到我使用了路径模块。

编辑 2:更改了变量的命名,使它们看起来更像有问题的代码。

编辑 3:在原始答案中,我使用路径模块获取 slug,将其更改为字符串替换。删除路径模块,它会产生错误。

Cedomir Rackov
2020-04-04