Next.JS14のデバッグでmapファイルが見つからない問題

VSCodeでデバッグ中にコンソールにこんなメッセージが頻繁に出て気になったので調べてみた。

Could not read source map for file:/.next/server/vendor-chunks/next.js: ENOENT: no such file or directory, open

こちらのIssueが参考になりました

Next.js v14.2 creates source map issues with various components in VS Code debugger · Issue #65795 · vercel/next.js

Link to the code that reproduces this issue To Reproduce run npx create-next-app Start the VS Code debugger running the ...

それを踏まえてlaunche.jsonをこんな感じに書き換え


{
"name": "Next.js: debug full stack",
"type": "node",
"request": "launch",
"program": "${workspaceFolder}/node_modules/.bin/next",
"runtimeArgs": ["--inspect --turbo"],
"skipFiles": ["<node_internals>/**"],
"serverReadyAction": {
"action": "debugWithChrome",
"killOnServerStop": true,
"pattern": "- Local:.+(https?://.+)",
"uriFormat": "%s",
"webRoot": "${workspaceFolder}"
}
}

runtimeArgsのところでNextを起動してますが、パラメータに–turboを追加
この設定ファイルはNextの公式から引っ張ってきてるんですが、色々説明不足や抜けが多い。