I recently made the switch from Page Router to App router.
Transitioning
pages
- 500.tsx
to
app
- 500
- page.tsx
However, I encountered an error when running yarn build/next build:
> Build error occurred
[Error: ENOENT: no such file or directory, rename '/Users/CCC/Desktop/SourceTree/my-frontend/.next/export/500.html' -> '/Users/CCC/Desktop/SourceTree/my-frontend/.next/server/pages/500.html'] {
errno: -2,
code: 'ENOENT',
syscall: 'rename',
path: '/Users/CCC/Desktop/SourceTree/my-frontend/.next/export/500.html',
dest: '/Users/CCC/Desktop/SourceTree/my-frontend/.next/server/pages/500.html'
}
error Command failed with exit code 1.
I have also reviewed next.config.js, but it doesn't seem to be the root cause of the issue
const {
PHASE_DEVELOPMENT_SERVER,
PHASE_PRODUCTION_BUILD,
} = require("next/constants");
const withTM = require("next-transpile-modules")([
// '@fullcalendar/common',
// '@fullcalendar/react',
// '@fullcalendar/daygrid',
// '@fullcalendar/list',
// '@fullcalendar/timegrid',
// '@fullcalendar/timeline'
]);
module.exports = (phase, { defaultConfig }) => {
const isDev = phase === PHASE_DEVELOPMENT_SERVER;
const isProd =
phase === PHASE_PRODUCTION_BUILD && process.env.STAGING !== "1";
const env = {...};
const config = {
...defaultConfig,
env,
swcMinify: true,
reactStrictMode: false,
webpack(config) {
config.module.rules.push({
test: /\.svg$/,
use: ["@svgr/webpack"],
});
return config;
},
};
return withTM(config);
};
I attempted to delete the .next folder and rebuild, but the error persists. What could be causing this?
Update
I tested accessing localhost:3000/500.
The UI displays correctly, however on the server side it returns
GET /500 500