Next.jsでModule not found: Can't resolve 'formidable'がnpm install @types/formidableしているのに発生する

前提

Next.jsでテキストと画像をFormDataで送信し、それをサーバー側でformidableモジュールを使って読み込みたい

実現したいこと

formidableが使えるようにする
画像をサーバー側に保存したい

発生している問題・エラーメッセージ

npm install @types/formidableを実行してpackage.jsonに登録されているのにimportできない
from "formidable" の部分でctrl + click したらちゃんとnode_modulesのファイルが表示されるのにこのエラーが起こる

TypeScript
1Module not found: Can't resolve 'formidable'
2  1 | import type { NextApiRequest, NextApiResponse } from "next";
3> 2 | import formidable from "formidable";
4  3 | type Data = {
5  4 |   name: string;
6  5 | };

該当のソースコード

import部分でエラーが出ているのでコードそのものは実行できないのですが記載しておきます。

TypeScript:/pages/api/upload.ts
1import type { NextApiRequest, NextApiResponse } from "next";
2import formidable from "formidable";
3type Data = {
4  name: string;
5};
6export default function handler(
7  req: NextApiRequest,
8  res: NextApiResponse<Data>
9) {
10
11  if (req.method !== "POST") return;
12
13  const form = new formidable.IncomingForm();
14
15  form.parse(req, async function (err, fields, files) {
16    if (err) {
17      res.status(500).end();
18      return;
19    }
20
21    console.log(req.body);
22    console.log(files);
23    
24
25    res.status(200).json({ name: "!!!" });
26  })
27}
28