next.jsのbuild時に出たいくつかのエラーの解決方法

# はじめに
next.jsをbuildした際にエラーが出て、buildできませんでした。
いくつかエラーが出たので。その解決方法についてまとめたいと思います。

# ①Type error: Route "app/api/qiita/route.ts" has an invalid "POST" export:
### 事象
next.jsでapi/qiita/route.tsにAPIを作成しました。
その際に、下記のように引数を二つ設定していましたが、その部分でエラーが出ていました。
```tsx
import { NextApiResponse } from "next";
import { NextResponse } from "next/server";

export async function POST(req: Request, res: NextApiResponse) {
```

### 解決方法
POSTの際にはresの引数を定義しなくても良いみたいでした。
なので、下記のように修正しました。

```tsx
import { NextApiResponse } from "next";
import { NextResponse } from "next/server";

export async function POST(req: Request) {
```

# ②Type '{ id: string; }' is missing the following properties from type 'Promise<any>': then, catch, finally, [Symbol.toStringTag]
### 事象
app/blogs/[id]/page.tsxにparamsでidを受け取るように定義していましたが、その部分でエラーが発生しました。
```bash
$ npm run build

> build
> next build

   ▲ Next.js 15.1.3
   - Environments: .env.local

   Creating an optimized production build ...

🌼   daisyUI 4.12.23
├─ ✔︎ 2 themes added             https://daisyui.com/docs/themes
╰─ ❤︎ Support daisyUI project:   https://opencollective.com/daisyui

 ✓ Compiled successfully
   Linting and checking validity of types  ..Failed to compile.

app/blogs/[id]/page.tsx
Type error: Type '{ params: { id: string; }; }' does not satisfy the constraint 'PageProps'.
  Types of property 'params' are incompatible.
    Type '{ id: string; }' is missing the following properties from type 'Promise<any>': then, catch, finally, [Symbol.toStringTag]

Static worker exited with code: 1 and signal: null
```


```tsx
export default async function Page({ params }: { params: { id: string } }) {
  const { id } = await params;
```

### 解決方法
next.js15にアップデートされたことによるエラーのようでした。
以前まではparamsは同期処理で受け取っていたのですが、next.js15からは非同期で受け取るようになったようです。
そのため、型定義を以下のように修正しました。
`Promise<>`を追加。
```tsx
export default async function Page({ params }: { params:  Promise<{ id: string }> }) {
  const { id } = await params;
```

## 参考
https://realunivlog.com/articles/nnz12bk-8

# ③TypeError: fetch failed
### 事象
buildの際に、`TypeError: fetch failedというエラーがでました。
ローカルでは問題なくfetchできていたので、かなり悩まされました。

```
$ npm run build

> build
> next build

   ▲ Next.js 15.1.3
   - Environments: .env.local

   Creating an optimized production build ...

🌼   daisyUI 4.12.23
├─ ✔︎ 2 themes added             https://daisyui.com/docs/themes
╰─ ❤︎ Support daisyUI project:   https://opencollective.com/daisyui

 ✓ Compiled successfully
 ✓ Linting and checking validity of types    
 ✓ Collecting page data    
Error occurred prerendering page "/". Read more: https://nextjs.org/docs/messages/prerender-error
TypeError: fetch failed
    at Object.fetch (node:internal/deps/undici/undici:11576:11)
    at process.processTicksAndRejections (node:internal/process/task_queues:95:5)
    at async h (/home/user_name/nextjs-dev/tech-blog/.next/server/app/page.js:1:5315)
Export encountered an error on /page: /, exiting the build.
 ⨯ Static worker exited with code: 1 and signal: null
```

### 解決方法
調べていると同じようなエラー記事が見つかりました。

https://medium.com/phantom3/next-js-14-build-prerender-error-fix-f3c51de2fe1d

どうやら、fetchで取得している部分には以下の記述を入れないとbuildできないようでした。

```tsx
export const dynamic = "force-dynamic"; //動的にレンダリングする
export const fetchCache = "force-no-store"; // 常に最新のデータを取得する
```

ただし、動的レンダリングやキャッシュ無効化は、パフォーマンスに影響する場合があるので注意が必要です。

# おわりに
以前とは違うバージョンを使用する際は、やはりエラーに悩まされます。
この記事がどなたかの役に立てば幸いです。