Why I can't find out build folder after runing npm run build on a nextjs project? - reactjs

Question

I have created a project using Nextjs framework.
When I run the project using npm run dev command, My project runs properly, and it's okay.
But when I run the command npm run build to build a project, After that, I can't find a build folder.
Bellow is the full report which is a builder shown to me:
λ npm run build
dastshafa-final#0.1.0 build
next build
info - Checking validity of types
./pages/cartProcess/index.js 13:6 Warning: React Hook useEffect has a
missing dependency: 'displayNavbar'. Either include it or remove the
dependenc y array. If 'displayNavbar' changes too often, find the
parent component that defines it and wrap that definition in use
Callback. react-hooks/exhaustive-deps 31:11 Warning: Do not use
. Use Image from 'next/image' instead. See:
https://nextjs.org/docs/messages/no-img-elem ent
#next/next/no-img-element
./pages/index.js 14:6 Warning: React Hook useEffect has a missing
dependency: 'setDisplayNavbar'. Either include it or remove the depend
ency array. If 'setDisplayNavbar' changes too often, find the parent
component that defines it and wrap that definition in useCallback.
react-hooks/exhaustive-deps
./components/navbar.js 58:21 Warning: Do not use . Use Image
from 'next/image' instead. See:
https://nextjs.org/docs/messages/no-img-elem ent
#next/next/no-img-element 101:17 Warning: passHref is missing. See:
https://nextjs.org/docs/messages/link-passhref
#next/next/link-passhref 117:9 Warning: passHref is missing. See:
https://nextjs.org/docs/messages/link-passhref
#next/next/link-passhref 118:11 Warning: Do not use . Use Image
from 'next/image' instead. See:
https://nextjs.org/docs/messages/no-img-ele ment
#next/next/no-img-element 118:11 Warning: img elements must have an
alt prop, either with meaningful text, or an empty string for
decorative imag es. jsx-a11y/alt-text
./components/productDetail.js 72:6 Warning: React Hook useMemo has a
missing dependency: 'productDetail'. Either include it or remove the
dependency array. react-hooks/exhaustive-deps 106:15 Warning: Do not
use . Use Image from 'next/image' instead. See:
https://nextjs.org/docs/messages/no-img-ele ment
#next/next/no-img-element 106:15 Warning: img elements must have an
alt prop, either with meaningful text, or an empty string for
decorative imag es. jsx-a11y/alt-text
./components/productItem.js 18:7 Warning: Do not use . Use Image
from 'next/image' instead. See:
https://nextjs.org/docs/messages/no-img-eleme nt
#next/next/no-img-element
./components/products.js 21:6 Warning: React Hook useEffect has a
missing dependency: 'dispatch'. Either include it or remove the
dependency arr ay. react-hooks/exhaustive-deps
./components/sort.js 37:6 Warning: React Hook useEffect has a missing
dependency: 'dispatch'. Either include it or remove the dependency arr
ay. react-hooks/exhaustive-deps 41:6 Warning: React Hook useEffect
has a missing dependency: 'filterProducts'. Either include it or
remove the dependen cy array. If 'filterProducts' changes too often,
find the parent component that defines it and wrap that definition in
u seCallback. react-hooks/exhaustive-deps
info - Need to disable some ESLint rules? Learn more here:
https://nextjs.org/docs/basic-features/eslint#disabling-rule s info -
Creating an optimized production build info - Compiled successfully
info - Collecting page data info - Generating static pages (4/4)
info - Finalizing page optimization
Page Size First Load JS ┌ ○
/ 6.37 kB 144 kB ├ └
css/b7d3c6e158495aa9.css 962 B ├ /_app
0 B 129 kB ├ ○ /404 194
B 129 kB ├ ○ /cartProcess 1.45 kB
130 kB ├ └ css/da339555cb6d6d6b.css 233 B └ λ
/product/[...params] 10.4 kB 148 kB
└ css/f78802d3b8b60c2b.css 2.98 kB
First Load JS shared by all 129 kB ├ chunks/framework-5f4595e5518b5600.js 42 kB ├
chunks/main-a054bbf31fb90f6a.js 27.6 kB ├
chunks/pages/_app-26dcf6f0f3b3e602.js 57.2 kB ├
chunks/webpack-62757ff16512d194.js 1.81 kB └
css/70cd855905d78aa0.css 24.4 kB
λ (Server) server-side renders at runtime (uses getInitialProps or
getServerSideProps) ○ (Static) automatically rendered as static HTML
(uses no initial props)
What is the problem? How can I fix it?

Answer 1

Look for a directory named .next which is the default the build command outputs to.
You can set a custom directory (for example build) by adding it to the distDir key in next.config.js:
const nextConfig = {
distDir: "build",
};
module.exports = nextConfig;
If you're exporting your app to static HTML, the export command outputs to a directory named out.