报错1
Maybe one of these should be marked as a client entry with "use client": ./app/components/NavBar/index.tsx ./app/pages/menu/index.tsx ./app/page.tsx
解决方案
"use client"; // This is a client component 👈🏽 import { useState } from "react"; export default function Card() { const [state, setState] = useState(""); // I can use client hooks 👈🏽 return <></>; }
报错2
Module not found: Can't resolve 'dns'
解决方案
这个报错的原因主要是因为在_app.tsx或者在layout.tsx中想要获取全局的数据使用了getStaticProps或getServerSideProps,而在官网文档中
报错3
Can't resolve 'tls’
getDataBaseList可以在getStaticProps用,但不能在generateStaticParams用,会报错
解决方案
在 Next.js 项目中,
getStaticProps
和 generateStaticParams
都是用于静态生成页面的函数,但它们的运行时环境有所不同。getStaticProps
是在服务器端运行的,而 generateStaticParams
是在构建时运行的。因此,可能会遇到一些与环境相关的问题。使用
getStaticPaths
export const getStaticPaths = async () => { const response = await getDataBaseList({ pageId: NOTION_POST_ID, from: "tags-index", }); const paths = response.tagOptions?.map((tag) => ({ tag: encodeURI(tag.id), })); return { paths, fallback: true, }; };
报错4
Error: A required parameter (tag) was not provided as a string received undefined in getStaticPaths for /tags/[tag]
解决方案
这个错误是由于
getStaticPaths
函数中未能正确生成 tag
参数的路径。 getStaticPaths
函数需要返回一个对象,该对象包含 paths
属性,该属性是一个具有 params
对象的数组,每个 params
对象都应该包含一个 tag
字符串