next.js: Local Build Successful, but when deploying on ZEIT, I get "Module not found: Can't resolve '../../assets/meAvatar.jpg' "
Bug report
As the title says
Describe the bug
When i build locally, using npm run build, the build loads just fine as it should. I can then run it using npm start and view it on localhost:3000. I then upload the repository to github and go to watch my project fail to deploy as it has countless times while trying to fix the issue. Here is the log that is reported:
23:52:18.923 Retrieving list of deployment files…
23:52:19.086 Downloading 52 deployment files…
23:52:47.935 Installing build runtime…
23:52:48.377 Build runtime installed: 442.214ms
23:52:48.736 Looking up build cache…
23:52:48.766 Build cache not found
23:52:49.132 Installing dependencies…
23:52:58.140 npm WARN portfolio@1.0.0 No description
23:52:58.141 npm WARN portfolio@1.0.0 No repository field.
23:52:58.141 npm WARN optional SKIPPING OPTIONAL DEPENDENCY: fsevents@1.2.12 (node_modules/webpack/node_modules/fsevents):
23:52:58.141 npm WARN notsup SKIPPING OPTIONAL DEPENDENCY: Unsupported platform for fsevents@1.2.12: wanted {“os”:“darwin”,“arch”:“any”} (current: {“os”:“linux”,“arch”:“x64”})
23:52:58.141 npm WARN optional SKIPPING OPTIONAL DEPENDENCY: fsevents@1.2.12 (node_modules/next/node_modules/fsevents):
23:52:58.141 npm WARN notsup SKIPPING OPTIONAL DEPENDENCY: Unsupported platform for fsevents@1.2.12: wanted {“os”:“darwin”,“arch”:“any”} (current: {“os”:“linux”,“arch”:“x64”})
23:52:58.141 npm WARN optional SKIPPING OPTIONAL DEPENDENCY: fsevents@2.1.2 (node_modules/fsevents):
23:52:58.141 npm WARN notsup SKIPPING OPTIONAL DEPENDENCY: Unsupported platform for fsevents@2.1.2: wanted {“os”:“darwin”,“arch”:“any”} (current: {“os”:“linux”,“arch”:“x64”})
23:52:58.143 added 682 packages from 263 contributors in 8.675s
23:52:58.402 14 packages are looking for funding
23:52:58.402 run npm fund
for details
23:52:58.443 Running “npm run build”
23:52:58.626 > portfolio@1.0.0 build /zeit/621d0a52
23:52:58.626 > next build
23:52:59.199 Creating an optimized production build…
23:52:59.213 Attention: Next.js now collects completely anonymous telemetry regarding usage.
23:52:59.213 This information is used to shape Next.js’ roadmap and prioritize features.
23:52:59.213 You can learn more, including how to opt-out if you’d not like to participate in this anonymous program, by visiting the following URL:
23:52:59.213 https://nextjs.org/telemetry
23:53:05.505 Failed to compile.
23:53:05.505 ./components/TopBarNavigator/index.js
23:53:05.505 Module not found: Can’t resolve ‘…/…/assets/meAvatar.jpg’ in ‘/zeit/621d0a52/components/TopBarNavigator’
23:53:05.506 > Build error occurred
23:53:05.507 Error: > Build failed because of webpack errors
23:53:05.507 at build (/zeit/621d0a52/node_modules/next/dist/build/index.js:13:900)
23:53:05.519 npm ERR! code ELIFECYCLE
23:53:05.519 npm ERR! errno 1
23:53:05.520 npm ERR! portfolio@1.0.0 build: next build
23:53:05.520 npm ERR! Exit status 1
23:53:05.520 npm ERR!
23:53:05.520 npm ERR! Failed at the portfolio@1.0.0 build script.
23:53:05.520 npm ERR! This is probably not a problem with npm. There is likely additional logging output above.
23:53:05.523 npm ERR! A complete log of this run can be found in:
23:53:05.523 npm ERR! /zeit/.npm/_logs/2020-04-06T04_53_05_520Z-debug.log
23:53:05.532 Error: Exited with 1
23:53:05.532 at ChildProcess.<anonymous> (/zeit/60d2972f44a2442d/.build-utils/node_modules/@now/build-utils/dist/index.js:31349:24)
23:53:05.532 at ChildProcess.emit (events.js:223:5)
23:53:05.532 at ChildProcess.EventEmitter.emit (domain.js:475:20)
23:53:05.532 at maybeClose (internal/child_process.js:1021:16)
23:53:05.533 at Process.ChildProcess._handle.onexit (internal/child_process.js:283:5)
23:53:07.128 Done with “package.json”
To Reproduce
- npm run build
- npm start and view behavior
- verify the application works the way I want then upload repo to github.
- go to ZEIT now and view the building process
Expected behavior
expect the build to have no errors
Screenshots
here is my package.json
here is my next.config.js
where the issue is said to occur, but actually occurs at every import
System information
- OS: Windows 10
- Browser chrome
- Version of Next.js:
Additional context
Add any other context about the problem here.
About this issue
- Original URL
- State: closed
- Created 4 years ago
- Reactions: 6
- Comments: 18 (4 by maintainers)
ok =.= I solved this. Change the name of component from layout.js to Layout.js 😐 Can’t understand why 😐
This is likely a duplicate of #11742.
I had the same exact problem hahaha even the git one. That was stupid for 30 minutes hahahah.
Thanks for sharing
Also there is a bug in my git (macOS v2.21.0) where changing a letter in lowercase in a file name won’t be counted as a commit. gosh.
Hello Please i still face this issue…
My app works well on local but doesn’t work well on vercel
Package.json ; { “name”: “next-landing”, “version”: “6.0.0”, “private”: true, “scripts”: { “dev”: “next”, “build”: “next build”, “start”: “next start”, “export”: “next build && next export”, “now-build”: “next build && next export -o dist”, “netlify-build”: “next build && next export” },
“dependencies”: { “@glidejs/glide”: “^3.4.1”, “@reach/accordion”: “^0.10.4”, “@redq/reuse-modal”: “^1.1.9”, “@styled-system/theme-get”: “^5.1.2”, “@zeit/next-css”: “^1.0.1”, “firebase-admin”: “^8.12.1”, “firebase-functions”: “^3.7.0”, “next”: “9.5.0”, “next-compose-plugins”: “^2.2.0”, “next-fonts”: “1.0.3”, “next-optimized-images”: “^2.6.1”, “next-transpile-modules”: “4.0.0”, “prop-types”: “^15.7.2”, “rc-drawer”: “^4.1.0”, “rc-progress”: “^3.0.0”, “rc-tabs”: “9.7.0”, “react”: “^16.13.1”, “react-accessible-accordion”: “3.0.1”, “react-anchor-link-smooth-scroll”: “^1.0.12”, “react-collapser”: “^1.5.10”, “react-content-loader”: “^5.1.0”, “react-countdown-now”: “^2.1.2”, “react-countup”: “^4.3.3”, “react-dom”: “^16.13.1”, “react-icons-kit”: “^1.3.1”, “react-id-swiper”: “^4.0.0”, “react-image”: “^4.0.1”, “react-image-gallery”: “0.8.18”, “react-masonry-component”: “^6.2.1”, “react-particles-js”: “^3.2.1”, “react-reveal”: “^1.2.2”, “react-rnd”: “^10.1.10”, “react-scroll-parallax”: “^2.3.3”, “react-scrollspy”: “^3.4.2”, “react-select”: “^3.1.0”, “react-stickynode”: “2.1.1”, “styled-components”: “^5.1.1”, “styled-system”: “5.1.5”, “swiper”: “^5.4.5” }, “devDependencies”: { “babel-plugin-styled-components”: “^1.10.7”, “imagemin-mozjpeg”: “^9.0.0”, “imagemin-optipng”: “^8.0.0”, “imagemin-svgo”: “^8.0.0” }, “engines”: { “node”: “12.x” }, “module”: “pages/index.js” }