Only the author or the admin can edit this post.
1.把client部分封装成组件作为server的子组件,把数据获取放在server层,数据传进client的子组件里进行渲染
tip: 在client组件中,确定是可以使用async方法获取数据的,需要写在useEffect中
并且不能写:
useEffect(async () => {
const res = await fetchData()
})
必须写:
useEffect(() => {
const fetchDataWrap = async () => {
const res = await fetchData()
}
})
--- --- ---
2.“A component was suspended by an uncached promise. Creating promises inside a Client Component or hook is not yet supported, except via a Suspense-compatible library or framework.”
answer: client里面不要有async await
--- --- ---
3.报错:Deprecation Warning on line 11, column 4 of file:///...
Sass's behavior for declarations that appear after nested
rules will be changing to match the behavior specified by CSS in an upcoming
version. To keep the existing behavior, move the declaration above the nested
rule. To opt into the new behavior, wrap the declaration in & {}.
answer: sass
这个警告的意思是,在 layer.scss 文件的第 11 行,你在嵌套规则之后写了一个声明(比如 color: red; 之类的样式),而 Sass 未来版本会更改这种行为,使其与标准 CSS 的解析方式保持一致。
ok:
.parent {
color: red; // right 将这个声明放在嵌套规则之前
.child {
font-size: 16px;
}
}
no:
.parent {
.child {
font-size: 16px;
}
color: red; // wrong 这种写法在未来的 Sass 版本可能会导致问题
}
--- --- ---
4.yarn dev正常,但是yarn build后的yarn start,访问页面报错:[Error: An error occurred in the Server Components render. The specific message is omitted in production builds to avoid leaking sensitive details. A digest property is included on this error instance which may provide additional details about the nature of the error.] {
digest: 'DYNAMIC_SERVER_USAGE'
}
这个错误是 Next.js 15 中的 Server Components 渲染错误,并且 digest: 'DYNAMIC_SERVER_USAGE' 表示 你可能在 Server Component 里使用了只能在 Client 端运行的 API。
可能的原因
1. 在 Server Component 里使用了 useRouter、useState、useEffect 等 React Hooks。
2. 使用了 window, document, localStorage 这些只能在客户端运行的对象。
3. 使用了 next/navigation 的 useRouter() 或 useSearchParams() 等 API,但它们不能在 Server Component 里使用。
4. 某些 API(如 fetch 请求外部数据)在 Server Component 里执行时导致问题。
* 你在 server component 里使用了 react-ga4
* 在 getServerSideProps 或 getStaticProps 里使用了 useState/useEffect
* 你的 layout.tsx 或 page.tsx 里错误地使用了 use client
排查了一整晚,确定是:
export async function generateStaticParams() {
const colLearningMapped = colLearning.map(item => ({
collectionName: item
}))
return colLearningMapped
}
想要生成静态页这个方法引起的
--- --- ---
5.
Application error: a client-side exception has occurred (see the browser console for more information).
answer:
用了
src不支持谷歌返回的图片src,引起渲染失败,于是报这个错
总结: 渲染出问题?
Application error: a server-side exception has occurred (see the server logs for more information).
Digest: 4009820815