当 npm 构建我的 gatsby 项目时，我得到以下信息：
Page data from page-data.json for the failed page "/404/": {
"componentChunkName": "component---src-pages-404-js",
"path": "/404/",
"result": {
"pageContext": {}
},
"staticQueryHashes": []
}
failed Building static HTML for pages - 3.357s
ERROR #95313
Building static HTML failed for path "/404/"
See our docs page for more info on this error: https://gatsby.dev/debug-html
21 | };
22 | this.defaultAttributeTypes = {
> 23 | position: 'Float32Array',
| ^
24 | normal: 'Float32Array',
25 | color: 'Float32Array',
26 | uv: 'Float32Array'
我不知道是什么意思，通过搜索互联网，我找到了这个问题Page data from page-data.json for the failed page "/"，我了解到这个错误可能是使用窗口对象引起的，所以我试图检查我的代码中的窗口使用，问题是我使用了反应三纤维，它可能正在使用这个文档对象，
然后，相同的答案表明可以通过向 gatsby-node.js 添加代码（我猜它没有说）来绕过这个错误，基本上是导出 onCreateWebpackConfig（在这个文件中，我正在导出 sourceNodes 和 onCreateWebpackConfig，希望这不会导致任何错误）
问题仍然存在。
我也有404页面
import React from "react";
const NotFoundPage = () => {
return <div>Sorry, the page you requested was not found</div>;
};
export default NotFoundPage;
请任何提示，我真的不知道如何解决它
****** 编辑 ******
Ferran 向我询问我的 onCreateWebpackConfig，它是：
exports.onCreateWebpackConfig = ({ stage, loaders, actions }) => {
if (stage === "build-html" || stage === "develop-html") {
actions.setWebpackConfig({
module: {
rules: [
{
test: /react-three-fiber/,
use: loaders.null(),
},
],
},
});
}
};
我输入了“test:/react-three-fiber/”，但我不确定，我应该输入“坏模块”，我不知道，我只知道我的组件
正如您所指出的，当您处理使用的第三方模块window或其他全局对象时，您需要在nullwebpack 配置中添加一个加载器，以绕过使用onCreateWebpackConfig. 在您的情况下，由于包名称是@react-three/fiber，请尝试以下操作：
exports.onCreateWebpackConfig = ({ stage, loaders, actions }) => {
actions.setWebpackConfig({
module: {
rules: [
{
test: /@react-three\/fiber/,
use: loaders.null(),
},
],
},
});
};
请记住，这test是一个正则表达式（这就是为什么在斜杠之间，/）并且它与 . 下的文件夹名称匹配node_modules。确保文件夹名称与正则表达式匹配。
回答配置 gatsby webpack 编译组件时不检查 window 等基础对象的重复性
但我也在组件中使用
canvas,window.innerWidth和诸如此类的东西如何设置另一个规则以指示 webpack 在检查组件时不抛出该错误？
对于第三方依赖项，您只需要继续将库添加到以前的null-loader 配置中：
exports.onCreateWebpackConfig = ({ stage, loaders, actions }) => {
actions.setWebpackConfig({
module: {
rules: [
{
test: /@react-three\/fiber/,
use: loaders.null(),
},
{
test: /other-library/,
use: loaders.null(),
},
],
},
});
};
请记住我所说的，/other-library/代表里面的文件夹名称node_modules。
对于window对象的内部使用，您只需要在使用它之前添加以下条件：
if(typeof window !== "undefined"){
//your window calculation
}
根据您使用的时间和方式window，您可能不需要将其包装在这种情况下（即：如果您使用window在useEffectDOM 加载之前不会触发的情况下将始终设置窗口）。
所有这些方法都可以在 Gatsby 文档中找到：https ://www.gatsbyjs.com/docs/debugging-html-builds/
顺便说一句，我在 gatsby-node.js 中有两个导出：
exports.sourceNodes = async ({...对于我与 graphql 一起使用并exports.onCreateWebpackConfig =...在此处描述的数据，这有什么问题吗？
当然不是，只是一个文件导出功能。这就是它应该如何工作的方式，这就是为什么你有一堆可用的 API 的原因。
本文收集自互联网，转载请注明来源。
如有侵权，请联系 [email protected] 删除。
我来说两句