Home > other >  Why I can't find out build folder after runing npm run build on a nextjs project?
Why I can't find out build folder after runing npm run build on a nextjs project?

Time:05-02

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

[email protected] 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?

CodePudding user response:

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.

  • Related