Я работаю над созданием статического образа докера 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»?
Я получаю ту же ошибку, когда добавляю 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 ```
Я смотрю на пример, который вы сейчас прислали @DileepaMabulage. Спасибо.
Если я скопирую этот пример дословно, я начну видеть эту ошибку: ------ > [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::hetdnfrdlu7ny3lq5pdrrox14: "/app/.next/standalone": not found Так близко! Я копаюсь в этом больше.


Вы повредили локальный образ узла. В файле 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 (хотя теперь я понимаю).
можешь попробовать добавить
npm installперед командой сборки