npm run build giving errors in React Hook Functions

Question

i am using nextjs 14

python-course/page.tsx

when i am running npm run build on my project, this page is giving error

this is my package.json

`` { "name": "frontend", "version": "0.1.0", "private": true, "scripts": { "dev": "next dev", "build": "next build", "start": "next start", "lint": "next lint" }, "browser": { "child process": "false" }, "dependencies": { "@clerk/nextjs": "^4.29.9", "@heroicons/react": "^1.0.6", "@stripe/stripe-js": "^3.2.0", "@tsparticles/engine": "^3.3.0", "@tsparticles/react": "^3.0.0", "@tsparticles/slim": "^3.3.0", "axios": "^1.6.7", "body-parser": "^1.20.2", "child_process": "^1.0.2", "child-process": "^1.0.2", "clerk": "^0.8.3", "clsx": "^2.1.0", "dotenv": "^16.4.5", "express": "^4.19.2", "firebase": "^10.0.0",

"react-firebase-hooks": "^5.1.1", "framer-motion": "^11.0.12", "isomorphic-unfetch": "^3.0.0", "mini-svg-data-uri": "^1.4.4", "mongodb": "^6.5.0", "mongoose": "^8.3.0", "next": "14.0.4", "raw-body": "^2.5.2", "react": "^18", "react-dom": "^18", "react-icons": "^5.0.1", "react-monaco-editor": "^0.55.0", "react-resizable": "^3.0.5", "react-split": "^2.0.14", "sharp": "^0.33.2", "stripe": "^14.23.0", "swr": "1.1.2", "tailwind-merge": "^2.2.1", "unfetch": "^5.0.0" 

}, "devDependencies": { "@types/node": "^20", "@types/raw-body": "^2.3.0", "@types/react": "^18", "@types/react-dom": "^18", "autoprefixer": "^10.0.1", "eslint": "^8", "eslint-config-next": "14.1.0", "postcss": "^8", "tailwindcss": "^3.3.0", "typescript": "^5" } }

``

i have never faced this type of error before and cannot get any solution from the internet

Answer 1

Put your 'page function name first character in capital letter like this 'Page'.

React components name must start with First letter capital.

Now your problem fixed😊

Tips: you should use handleScroll function outside of useEffect and pass it inside [].