I am working on a next JS project. I can successfully build that on my local machine. But when I am trying to dockerized the app and build the app inside the docker image I am getting error while building the app. From the error I think that the docker build can not find my static image files. But I can browse the files inside docker image.
My File Structure
- assets
-
- image files
- components
-
- common components
- data
-
- some static data
- pages
- public
- styles
Dockerfile
FROM node:18-alpine3.14
RUN apk update && \
apk add --no-cache libc6-compat
ENV NEXT_TELEMETRY_DISABLED 1
ENV NODE_ENV production
ENV PORT 3000
EXPOSE 3000
COPY . /app
WORKDIR /app
RUN adduser -u 5678 --disabled-password --gecos "" appuser && chown -R appuser /app
USER appuser
RUN yarn install
RUN yarn build
ENTRYPOINT [ "sh", "entrypoint.sh" ]
entrypoint.sh
yarn start
Error During Build
info - Creating an optimized production build
Failed to compile.
./assets/company/employee/group.jpg
TypeError: Failed to parse URL from /app/node_modules/next/dist/server/lib/squoosh/mozjpeg/mozjpeg_node_dec.wasm
at new Request (node:internal/deps/undici/undici:4816:19)
at Agent2.fetch2 (node:internal/deps/undici/undici:5544:29)
at Object.fetch (node:internal/deps/undici/undici:6372:20)
at fetch (node:internal/bootstrap/pre_execution:199:25)
at instantiateAsync (/app/node_modules/next/dist/server/lib/squoosh/mozjpeg/mozjpeg_node_dec.js:424:28)
at createWasm (/app/node_modules/next/dist/server/lib/squoosh/mozjpeg/mozjpeg_node_dec.js:447:13)
at /app/node_modules/next/dist/server/lib/squoosh/mozjpeg/mozjpeg_node_dec.js:1480:19
at Object.instantiateEmscriptenWasm (/app/node_modules/next/dist/server/lib/squoosh/emscripten-utils.js:15:12)
at Object.dec (/app/node_modules/next/dist/server/lib/squoosh/codecs.js:156:42)
at Object.decodeBuffer (/app/node_modules/next/dist/server/lib/squoosh/impl.js:55:31)
Import trace for requested module:
./pages/ourcompany/OurStory.js
./assets/home/clientFeedBack/image/Ellipse 6-2.jpg
TypeError: Failed to parse URL from /app/node_modules/next/dist/server/lib/squoosh/mozjpeg/mozjpeg_node_dec.wasm
at new Request (node:internal/deps/undici/undici:4816:19)
at Agent2.fetch2 (node:internal/deps/undici/undici:5544:29)
at Object.fetch (node:internal/deps/undici/undici:6372:20)
at fetch (node:internal/bootstrap/pre_execution:199:25)
at instantiateAsync (/app/node_modules/next/dist/server/lib/squoosh/mozjpeg/mozjpeg_node_dec.js:424:28)
at createWasm (/app/node_modules/next/dist/server/lib/squoosh/mozjpeg/mozjpeg_node_dec.js:447:13)
at /app/node_modules/next/dist/server/lib/squoosh/mozjpeg/mozjpeg_node_dec.js:1480:19
at Object.instantiateEmscriptenWasm (/app/node_modules/next/dist/server/lib/squoosh/emscripten-utils.js:15:12)
at Object.dec (/app/node_modules/next/dist/server/lib/squoosh/codecs.js:156:42)
at Object.decodeBuffer (/app/node_modules/next/dist/server/lib/squoosh/impl.js:55:31)
Import trace for requested module:
./components/ClientFeedback.js
./pages/index.js
./assets/home/globalSection/Rectangle 32.jpg
TypeError: Failed to parse URL from /app/node_modules/next/dist/server/lib/squoosh/mozjpeg/mozjpeg_node_dec.wasm
at new Request (node:internal/deps/undici/undici:4816:19)
at Agent2.fetch2 (node:internal/deps/undici/undici:5544:29)
at Object.fetch (node:internal/deps/undici/undici:6372:20)
at fetch (node:internal/bootstrap/pre_execution:199:25)
at instantiateAsync (/app/node_modules/next/dist/server/lib/squoosh/mozjpeg/mozjpeg_node_dec.js:424:28)
at createWasm (/app/node_modules/next/dist/server/lib/squoosh/mozjpeg/mozjpeg_node_dec.js:447:13)
at /app/node_modules/next/dist/server/lib/squoosh/mozjpeg/mozjpeg_node_dec.js:1480:19
at Object.instantiateEmscriptenWasm (/app/node_modules/next/dist/server/lib/squoosh/emscripten-utils.js:15:12)
at Object.dec (/app/node_modules/next/dist/server/lib/squoosh/codecs.js:156:42)
at Object.decodeBuffer (/app/node_modules/next/dist/server/lib/squoosh/impl.js:55:31)
Import trace for requested module:
./pages/GlobalFamily.js
./assets/home/serviceSection/bg.jpg
TypeError: Failed to parse URL from /app/node_modules/next/dist/server/lib/squoosh/mozjpeg/mozjpeg_node_dec.wasm
at new Request (node:internal/deps/undici/undici:4816:19)
at Agent2.fetch2 (node:internal/deps/undici/undici:5544:29)
at Object.fetch (node:internal/deps/undici/undici:6372:20)
at fetch (node:internal/bootstrap/pre_execution:199:25)
at instantiateAsync (/app/node_modules/next/dist/server/lib/squoosh/mozjpeg/mozjpeg_node_dec.js:424:28)
at createWasm (/app/node_modules/next/dist/server/lib/squoosh/mozjpeg/mozjpeg_node_dec.js:447:13)
at /app/node_modules/next/dist/server/lib/squoosh/mozjpeg/mozjpeg_node_dec.js:1480:19
at Object.instantiateEmscriptenWasm (/app/node_modules/next/dist/server/lib/squoosh/emscripten-utils.js:15:12)
at Object.dec (/app/node_modules/next/dist/server/lib/squoosh/codecs.js:156:42)
at Object.decodeBuffer (/app/node_modules/next/dist/server/lib/squoosh/impl.js:55:31)
Import trace for requested module:
./pages/Services.js
./assets/home/serviceViewSection/Rectangle 420.jpg
TypeError: Failed to parse URL from /app/node_modules/next/dist/server/lib/squoosh/mozjpeg/mozjpeg_node_dec.wasm
at new Request (node:internal/deps/undici/undici:4816:19)
at Agent2.fetch2 (node:internal/deps/undici/undici:5544:29)
at Object.fetch (node:internal/deps/undici/undici:6372:20)
at fetch (node:internal/bootstrap/pre_execution:199:25)
at instantiateAsync (/app/node_modules/next/dist/server/lib/squoosh/mozjpeg/mozjpeg_node_dec.js:424:28)
at createWasm (/app/node_modules/next/dist/server/lib/squoosh/mozjpeg/mozjpeg_node_dec.js:447:13)
at /app/node_modules/next/dist/server/lib/squoosh/mozjpeg/mozjpeg_node_dec.js:1480:19
at Object.instantiateEmscriptenWasm (/app/node_modules/next/dist/server/lib/squoosh/emscripten-utils.js:15:12)
at Object.dec (/app/node_modules/next/dist/server/lib/squoosh/codecs.js:156:42)
at Object.decodeBuffer (/app/node_modules/next/dist/server/lib/squoosh/impl.js:55:31)
Import trace for requested module:
./pages/ServiceView.js
> Build failed because of webpack errors
I would appreciate the help.
Thanks
CodePudding user response:
The problem was with the alpine distro. It is a basic linux package that doesn't have any dependency. We need to install some dependency here, specially to handle JPEG images.
Updated Code: Dockerfile
FROM node:lts-alpine3.14
RUN apk update && \
apk add --no-cache libc6-compat autoconf automake libtool make tiff jpeg zlib zlib-dev pkgconf nasm file gcc musl-dev
# COPY package.json .
RUN npm install -g npm
ENV NEXT_TELEMETRY_DISABLED 1
ENV NODE_ENV production
ENV PORT 3000
EXPOSE 3000
COPY . /app
WORKDIR /app
RUN adduser -u 5678 --disabled-password --gecos "" appuser && chown -R appuser /app
USER appuser
RUN yarn install
RUN yarn build
ENTRYPOINT [ "sh", "entrypoint.sh" ]