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
>Solution :
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 [].