Как устранить ошибку сборки Dockerfile статического приложения Next.js: «Ошибка: невозможно найти модуль [X]»?

Я работаю над созданием статического образа докера Next.js после успешной настройки среды докера разработки. У меня растет список проблем, возникающих при сборке. Я следил за другими похожими сообщениями, которые мне пока не удалось найти.

В настоящее время, когда я запускаю:

# clean out related images for a fresh start
docker rmi -f $(docker images -a -q)

# build and run
docker-compose -f docker-compose.prod.yaml up --build

Я вижу эту ошибку:

=> ERROR [ui builder 6/6] RUN npm run build                                                     3.0s
------
 > [ui builder 6/6] RUN npm run build:
0.458 
0.458 > [email protected] build
0.458 > next build
0.458 
0.803 Attention: Next.js now collects completely anonymous telemetry regarding usage.
0.803 This information is used to shape Next.js' roadmap and prioritize features.
0.803 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:
0.803 https://nextjs.org/telemetry
0.803 
0.841   ▲ Next.js 14.2.4
0.841 
0.872    Creating an optimized production build ...
2.913 Failed to compile.
2.913 
2.913 src/app/layout.tsx
2.913 An error occurred in `next/font`.
2.913 
2.913 Error: Cannot find module 'tailwindcss'
2.913 Require stack:
2.913 - /home/node/app/node_modules/next/dist/build/webpack/config/blocks/css/plugins.js
2.913 - /home/node/app/node_modules/next/dist/build/webpack/config/blocks/css/index.js
2.913 - /home/node/app/node_modules/next/dist/build/webpack/config/index.js
2.913 - /home/node/app/node_modules/next/dist/build/webpack-config.js
2.913 - /home/node/app/node_modules/next/dist/build/webpack/plugins/next-trace-entrypoints-plugin.js
2.913 - /home/node/app/node_modules/next/dist/build/collect-build-traces.js
2.913 - /home/node/app/node_modules/next/dist/build/index.js
2.913 - /home/node/app/node_modules/next/dist/cli/next-build.js
2.913     at Module._resolveFilename (node:internal/modules/cjs/loader:1090:15)
2.913     at /home/node/app/node_modules/next/dist/server/require-hook.js:55:36
2.913     at Function.resolve (node:internal/modules/helpers:125:19)
2.913     at loadPlugin (/home/node/app/node_modules/next/dist/build/webpack/config/blocks/css/plugins.js:49:32)
2.913     at /home/node/app/node_modules/next/dist/build/webpack/config/blocks/css/plugins.js:157:56
2.913     at Array.map (<anonymous>)
2.913     at getPostCssPlugins (/home/node/app/node_modules/next/dist/build/webpack/config/blocks/css/plugins.js:157:47)
2.913     at async /home/node/app/node_modules/next/dist/build/webpack/config/blocks/css/index.js:124:36
2.913     at async /home/node/app/node_modules/next/dist/build/webpack/loaders/next-font-loader/index.js:86:33
2.913     at async Span.traceAsyncFn (/home/node/app/node_modules/next/dist/trace/trace.js:154:20)
2.913 
2.914 
2.914 > Build failed because of webpack errors
------
failed to solve: process "/bin/sh -c npm run build" did not complete successfully: exit code: 1

Для меня это воспринимается как проблема с разрешениями или файлы, которые не копируются, но я пока не совсем понимаю, что мне нужно делать для этой сборки.

Вот /ui/Dockerfile.prod:

# Build app
FROM node:19 AS builder

# Set working directory
WORKDIR /home/node/app

# Copy package.json and package-lock.json and install dependencies
COPY package.json package-lock.json* ./
RUN npm ci

# Copy the rest of the application files
COPY . .

# Build the Next.js app
RUN npm run build

# Prod image
FROM node:19 AS runner

# Set working directory
WORKDIR /home/node/app

# Copy built files from builder stage
COPY --from=builder /home/node/app/.next ./.next
COPY --from=builder /home/node/app/public ./public
COPY --from=builder /home/node/app/node_modules ./node_modules
COPY --from=builder /home/node/app/package.json ./package.json

# Set environment variables
ENV NODE_ENV=production
ENV PORT=3000

# Expose the port
EXPOSE 3000

# Start the Next.js app
CMD ["npm", "start"]

docker-compose.prod.yaml:

version: '3.8'

services:
    postgres:
        container_name: postgres-prod
        image: postgres:16
        ports:
            - '5432:5432'
        volumes:
            - ./postgresdata:/var/lib/postgresql/data
            - ./src/migrations/dbinit.sql:/docker-entrypoint-initdb.d/dbinit.sql
        restart: always
        environment:
            POSTGRES_USER: ${POSTGRES_USER}
            POSTGRES_PASSWORD: ${POSTGRES_PASSWORD}
            POSTGRES_DB: ${POSTGRES_DB}
        networks:
            - app-network

    api:
        container_name: api-prod
        image: 'node:19'
        build:
            context: ./server
            dockerfile: Dockerfile.prod
        user: 'node'
        working_dir: /home/node/app
        environment:
            - 'NODE_ENV=${NODE_ENV}'
            - 'PORT=3000'
            - 'DATABASE_URL=${DATABASE_URL}'
        expose:
            - '3000'
        ports:
            - '3000:3000'
        command: 'npm run dev:migrate:start'
        networks:
            - app-network
        depends_on:
            - postgres

    ui:
        container_name: ui-prod
        build:
            context: ./ui
            dockerfile: Dockerfile.prod
        user: 'node'
        working_dir: /home/node/app
        environment:
            - 'NODE_ENV=production'
            - 'NEXT_PUBLIC_API_URL=${NEXT_PUBLIC_API_URL}'
            - 'NEXT_PUBLIC_SOCKET_URL=${NEXT_PUBLIC_SOCKET_URL}'
        ports:
            - '8080:8080'
        command: 'npm start'
        networks:
            - app-network
        depends_on:
            - api

    nginx:
        build:
            context: ./nginx
            dockerfile: Dockerfile.prod
        container_name: nginx-prod
        restart: always
        tty: true
        ports:
            - '80:80'
        networks:
            - app-network
        depends_on:
            - api
            - ui

networks:
    app-network:
        driver: bridge

/ui/package.json:

{
  "name": "ui",
  "version": "0.1.0",
  "private": true,
  "scripts": {
    "dev": "next dev -p 8080",
    "build": "next build",
    "start": "next start -p 8080",
    "lint": "next lint"
  },
  "dependencies": {
    "@auth0/auth0-react": "^2.2.4",
    "next": "14.2.4",
    "react": "^18",
    "react-dom": "^18",
    "socket.io-client": "^4.7.5"
  },
  "devDependencies": {
    "@types/node": "^20",
    "@types/react": "^18",
    "@types/react-dom": "^18",
    "eslint": "^8",
    "eslint-config-next": "14.2.4",
    "next-image-export-optimizer": "^1.14.1",
    "postcss": "^8",
    "tailwindcss": "^3.4.1",
    "typescript": "^5"
  }
}

Я использую Windows 11 Home, Docker Desktop, запускаю сборку через WSL/Ubuntu.

(примечание: я заметил, что мне нужно настроить порты, но это не связано).

Как устранить ошибку сборки Dockerfile статического приложения Next.js: ошибка «Ошибка: невозможно найти модуль Tailwindcss»?

можешь попробовать добавить npm install перед командой сборки

Dileepa Mabulage 21.06.2024 16:26

Я получаю ту же ошибку, когда добавляю RUN npm install непосредственно перед RUN npm run build ``` => [ui builder 6/7] RUN npm i 1.0s => ОШИБКА [ui builder 7/7] RUN npm run build 3.4s ```

Christopher Stevens 21.06.2024 17:13

Я смотрю на пример, который вы сейчас прислали @DileepaMabulage. Спасибо.

Christopher Stevens 21.06.2024 17:14

Если я скопирую этот пример дословно, я начну видеть эту ошибку: ------ > [ui runner 7/8] COPY --from=builder --chown=nextjs:nodejs /app/.next/standalone ./: ------ failed to solve: failed to compute cache key: failed to calculate checksum of ref 6da1a0ef-28bd-4a52-a312-c9dab1bff747::hetdnfrdlu7ny3lq5pdrro‌​x14: "/app/.next/standalone": not found Так близко! Я копаюсь в этом больше.

Christopher Stevens 21.06.2024 17:23
Развертывание модели машинного обучения с помощью Flask - Angular в Kubernetes
Развертывание модели машинного обучения с помощью Flask - Angular в Kubernetes
Kubernetes - это портативная, расширяемая платформа с открытым исходным кодом для управления контейнерными рабочими нагрузками и сервисами, которая...
Как создать PHP Image с нуля
Как создать PHP Image с нуля
Сегодня мы создадим PHP Image from Scratch для того, чтобы легко развернуть базовые PHP-приложения. Пожалуйста, имейте в виду, что это разработка для...
0
5
107
1
Перейти к ответу Данный вопрос помечен как решенный

Ответы 1

Ответ принят как подходящий

Вы повредили локальный образ узла. В файле Compose удалите строку:

services:
  api:
    image: 'node:19'  # <-- DELETE

и запустить вручную

docker pull node:19

и ваша сборка должна снова работать.

Если в вашем файле Compose есть как build:, так и image:, Compose создает изображение, как описано, а затем помечает его указанным image: именем. В этой настройке вы заменяете локальную копию node:19 окончательным результатом сборки; это устанавливает NODE_ENV=production. Когда вы пересобираете его второй раз, он запускается с результатами предыдущей сборки (он не перетягивает исходный образ), а с установленным NODE_ENV он устанавливает только производственные зависимости.

Вам следует устанавливать build: и image: вместе только в том случае, если вы планируете отправить образ в удаленный реестр, например Docker Hub. В этом случае image: — это имя результирующего изображения, а не базового изображения.

Многие другие настройки в вашем файле Compose либо переопределяют параметры, находящиеся в файле Dockerfile (user:, expose:, command:, environment: [NODE_ENV=...]), либо являются параметрами, которые Compose может установить сам (container_name:, networks:). Вы также можете значительно упростить файл Compose, удалив их.

Спасибо за ваш отзыв! Я чувствовал, что это было полезно для обучения и решило проблему сборки. Было интересно, что симптомы проявлялись в сборке ui, в то время как в api был указан image плюс build (хотя теперь я понимаю).

Christopher Stevens 21.06.2024 17:51

Другие вопросы по теме