As I endeavor to launch my latest 13 app, everything seems fine during the build process with no errors. However, when attempting to access the app, only HTML content appears, and a 404 error is displayed for Js, Css, and images (as evident in the network tab).
The app is trying to load from the _next folder by default (a path that does not exist)
For example: http://localhost:3000/_next/static/chunks/522-b7eb9fb4e38abfae.js
Additionally, it is trying to load images directly
For example: http://localhost:3000/assets/login.png
Unfortunately, I am unable to share the source code.
I have exhausted all avenues of resolution. Any assistance would be greatly appreciated.
My folder structure is as follows:
My-app
|_ public
|_ assets/
|_[all my images]
|_ nodemodules
|_ .next
|_ out
|_ src
|_ app
|_ Dockerfile
|_ next.config.js
|_ package.json
Scripts being used are detailed below:
next.config.js
module.exports = {
basePath: "",
output: "standalone",
experimental: {
appDir: true,
},
images: {
domains: [
"localhost",
"localhost:3001",
"my-exapmle-domain.com",
],
},
};
Dockerfile configuration:
#Using a different image, below is just an example
FROM node:16_alpine-3.16 AS prebuild
USER root
WORKDIR /app
ARG env
ENV NODE_ENV=${env}
RUN apk add --no-cache libc6-compat
RUN apk add --update npm
COPY package.json ./
COPY package-lock.json ./
RUN npm i --legacy-peer-deps
COPY . .
RUN npm run build
#Remaining Dockerfile steps continue...
package.json details:
name: "my-app",
version: "0.1.0",
private: true,
scripts: {
"dev": "PORT=3001 npx next dev",
"build": "npx next build",
"start": "PORT=3001 next start",
"lint": "next lint"
},
dependencies: {...},
devDependencies: {...}