"盖茨比发展"；工作良好。但是，"盖茨比构建"中出现错误
Something went wrong installing the "sharp" module
Cannot find module '../build/Release/sharp-darwin-arm64v8.node'
上面的问题一开始就出现了，所以我们用下面的方法解决了。
rm -r node_modules/sharp
yarn install --check-files
"gatsby-build"问题
我已经确认它在开发环境中运行良好。
Page data from page-data.json for the failed page "/main/post/": {
"componentChunkName": "component---src-pages-main-post-index-tsx",
"path": "/main/post/",
"result": {
"pageContext": {}
},
"staticQueryHashes": []
}
failed Building static HTML for pages - 3.088s
ERROR #95313
Building static HTML failed for path "/main/post/"
See our docs page for more info on this error: https://gatsby.dev/debug-html
19 | const postListData = useMemo(
20 | () =>
> 21 | posts.filter(
| ^
22 | ({
23 | node: {
24 | frontmatter: { categories },
WebpackError: TypeError: Cannot read properties of undefined (reading 'filter')
package.json
{
"dependencies": {
"@emotion/react": "^11.8.2",
"@emotion/styled": "^11.8.1",
"@fortawesome/fontawesome-svg-core": "^6.1.1",
"@fortawesome/free-solid-svg-icons": "^6.1.1",
"@fortawesome/react-fontawesome": "^0.1.18",
"@types/react-helmet": "^6.1.5",
"gatsby": "^4.10.3",
"gatsby-plugin-canonical-urls": "^4.10.0",
"gatsby-plugin-emotion": "^7.10.0",
"gatsby-plugin-image": "^2.10.1",
"gatsby-plugin-offline": "^5.10.2",
"gatsby-plugin-react-helmet": "^5.10.0",
"gatsby-plugin-robots-txt": "^1.7.0",
"gatsby-plugin-sharp": "^4.10.2",
"gatsby-plugin-typescript": "^4.10.1",
"gatsby-remark-copy-linked-files": "^5.10.0",
"gatsby-remark-external-links": "^0.0.4",
"gatsby-remark-images": "^6.10.2",
"gatsby-remark-prismjs": "^6.10.0",
"gatsby-remark-smartypants": "^5.10.0",
"gatsby-source-filesystem": "^4.10.1",
"gatsby-transformer-remark": "^5.10.2",
"gatsby-transformer-sharp": "^4.10.0",
"prismjs": "^1.27.0",
"prop-types": "^15.8.1",
"query-string": "^7.1.1",
"react": "^17.0.1",
"react-dom": "^17.0.1",
"react-helmet": "^6.1.0"
},
"devDependencies": {
"@typescript-eslint/eslint-plugin": "^5.16.0",
"@typescript-eslint/parser": "^5.16.0",
"eslint": "^8.12.0",
"eslint-config-prettier": "^8.5.0",
"eslint-plugin-prettier": "^4.0.0",
"prettier": "^2.6.1",
"typescript": "^4.6.3"
},
}
https://github.com/urther/gatsby_blog
这是完整的代码地址。
谢谢。
总结很多gatsby develop是由浏览器解释的，而gatsby build是在Node服务器(您的机器或部署服务器(中编译的，因此代码的行为略有不同。特别是与全局对象和SSR相关的内容(sserver-sideRendering(。您的代码在gatsby develop下工作的事实意味着它在某些特定条件下工作，而不是您的代码始终工作或没有错误，如果它在gatsby build中成功，则应该推断出这一点。
在您的情况下，至少在初始渲染中使用内存化挂钩(useMemo(时，posts数据似乎是undefined。
尝试使用：
const PostList: FunctionComponent<PostListProps> = ({
selectedCategory,
posts,
}) => {
const postListData = useMemo(
() =>
posts?.filter(
({
node: {
frontmatter: { categories },
},
}: PostListItemType) =>
selectedCategory !== 'All'
? categories.includes(selectedCategory)
: true,
),
[selectedCategory],
)
或者将filter包装在：下
if(posts){
posts.filter(
({
node: {
frontmatter: { categories },
},
}: PostListItemType) =>
selectedCategory !== 'All'
? categories.includes(selectedCategory)
: true,
),
}