I’m working on nextjs 14.2 version with pages folder. I don’t have any images, /api routes or anything yet. This is an old nextjs app, updated to latest version.
When I run npm run build, it is not generating .out folder. Only .next folder is created.
nextjs.config.mts:
<code>const nextConfig: NextConfig = {
output: 'export',
reactStrictMode: true,
webpack(config, { isServer }) {
config.module.rules.push({
test: /.svg$/,
use: ['@svgr/webpack'],
});
return config;
},
};
</code>
<code>const nextConfig: NextConfig = {
output: 'export',
reactStrictMode: true,
webpack(config, { isServer }) {
config.module.rules.push({
test: /.svg$/,
use: ['@svgr/webpack'],
});
return config;
},
};
</code>
const nextConfig: NextConfig = {
output: 'export',
reactStrictMode: true,
webpack(config, { isServer }) {
config.module.rules.push({
test: /.svg$/,
use: ['@svgr/webpack'],
});
return config;
},
};
Is typescript, next config valid?
and below is my next build output log.
<code>> [email protected] build:next
> next build
▲ Next.js 14.2.7
✓ Linting and checking validity of types
Creating an optimized production build ...
✓ Compiled successfully
✓ Collecting page data
✓ Generating static pages (3/3)
✓ Collecting build traces
✓ Finalizing page optimization
Route (pages) Size First Load JS
┌ ○ / 445 B 78.9 kB
├ └ css/9892d4308d0bb550.css 355 B
├ /_app 0 B 78.5 kB
└ ○ /404 180 B 78.7 kB
+ First Load JS shared by all 78.9 kB
├ chunks/framework-ecc4130bc7a58a64.js 45.2 kB
├ chunks/main-b203a0fef99bcbd5.js 32.1 kB
└ other shared chunks (total) 1.63 kB
○ (Static) prerendered as static content
</code>
<code>> [email protected] build:next
> next build
▲ Next.js 14.2.7
✓ Linting and checking validity of types
Creating an optimized production build ...
✓ Compiled successfully
✓ Collecting page data
✓ Generating static pages (3/3)
✓ Collecting build traces
✓ Finalizing page optimization
Route (pages) Size First Load JS
┌ ○ / 445 B 78.9 kB
├ └ css/9892d4308d0bb550.css 355 B
├ /_app 0 B 78.5 kB
└ ○ /404 180 B 78.7 kB
+ First Load JS shared by all 78.9 kB
├ chunks/framework-ecc4130bc7a58a64.js 45.2 kB
├ chunks/main-b203a0fef99bcbd5.js 32.1 kB
└ other shared chunks (total) 1.63 kB
○ (Static) prerendered as static content
</code>
> [email protected] build:next
> next build
▲ Next.js 14.2.7
✓ Linting and checking validity of types
Creating an optimized production build ...
✓ Compiled successfully
✓ Collecting page data
✓ Generating static pages (3/3)
✓ Collecting build traces
✓ Finalizing page optimization
Route (pages) Size First Load JS
┌ ○ / 445 B 78.9 kB
├ └ css/9892d4308d0bb550.css 355 B
├ /_app 0 B 78.5 kB
└ ○ /404 180 B 78.7 kB
+ First Load JS shared by all 78.9 kB
├ chunks/framework-ecc4130bc7a58a64.js 45.2 kB
├ chunks/main-b203a0fef99bcbd5.js 32.1 kB
└ other shared chunks (total) 1.63 kB
○ (Static) prerendered as static content
package.json
<code>{
,
"dependencies": {
...
"next": "^14.2.7",
"serve": "^14.2.3"
...
},
}
</code>
<code>{
,
"dependencies": {
...
"next": "^14.2.7",
"serve": "^14.2.3"
...
},
}
</code>
{
,
"dependencies": {
...
"next": "^14.2.7",
"serve": "^14.2.3"
...
},
}
As you can see here, .next is created but no .out. What could be wrong?
Follow the official documentation and change the name of the output directory.
<code>/**
* @type {import('next').NextConfig}
*/
const nextConfig = {
output: 'export',
// Optional: Change links `/me` -> `/me/` and emit `/me.html` -> `/me/index.html`
// trailingSlash: true,
// Optional: Prevent automatic `/me` -> `/me/`, instead preserve `href`
// skipTrailingSlashRedirect: true,
// Optional: Change the output directory `out` -> `dist`
// distDir: 'dist',
}
module.exports = nextConfig
</code>
<code>/**
* @type {import('next').NextConfig}
*/
const nextConfig = {
output: 'export',
// Optional: Change links `/me` -> `/me/` and emit `/me.html` -> `/me/index.html`
// trailingSlash: true,
// Optional: Prevent automatic `/me` -> `/me/`, instead preserve `href`
// skipTrailingSlashRedirect: true,
// Optional: Change the output directory `out` -> `dist`
// distDir: 'dist',
}
module.exports = nextConfig
</code>
/**
* @type {import('next').NextConfig}
*/
const nextConfig = {
output: 'export',
// Optional: Change links `/me` -> `/me/` and emit `/me.html` -> `/me/index.html`
// trailingSlash: true,
// Optional: Prevent automatic `/me` -> `/me/`, instead preserve `href`
// skipTrailingSlashRedirect: true,
// Optional: Change the output directory `out` -> `dist`
// distDir: 'dist',
}
module.exports = nextConfig