Next JS 应用程序在本地构建，但在 Docker 内失败

Question

我正在开发下一个 JS 项目。我可以在本地计算机上成功构建它。但是，当我尝试对应用程序进行 docker 化并在 docker 映像内构建应用程序时，我在构建应用程序时遇到错误。从错误中我认为 docker build 找不到我的静态图像文件。但我可以浏览docker镜像内的文件。

我的文件结构

• 资产
• • 图像文件
• 成分
• • 通用组件
• 数据
• • 一些静态数据
• 页面
• 民众
• 风格

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" ]

入口点.sh

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" ]

构建期间出错

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

我将不胜感激的帮助。

谢谢

Answer 1

在使用节点 18 的 Next 12.1.6 中导入图像时出现问题。

https://github.com/vercel/next.js/issues/38020

正如评论中指出的，npm i sharp可能会解决该问题。