I keep getting a dependency conflict error when trying to build my nextjs app on docker. I don't get any error when I am working locally and I can't seem to figure out what the difference is that might be causing this...
# Use the official Node.js slim image as a base
FROM node:20.18.0-slim
# Set the working directory
WORKDIR /app
# Copy package.json and package-lock.json (if available)
COPY package*.json ./
# Install dependencies
RUN npm install
# Copy the rest of the application code
COPY . .
# Build the Next.js app
RUN npm run build
# Expose the port the app runs on
EXPOSE 3000
# Start the Next.js app
CMD ["npm", "start"]
While the error I get is a dependency conflict error message, my main focus is why my local environment is building fine but I am getting errors while trying to build on docker. Any debugging hints will also be appreciated.
Showing package.json
{
"name": "project",
"version": "1.2.0",
"private": true,
"scripts": {
"dev": "next dev",
"build": "next build",
"start": "next start",
"export": "next export",
"lint": "eslint --fix \"src/**/*.{js,jsx}\"",
"format": "prettier --write \"src/**/*.{js,jsx}\"",
"build:icons": "node src/iconify-bundle/bundle-icons-react.js"
},
"dependencies": {
"@babel/core": "7.21.5",
"@babel/eslint-parser": "7.21.3",
"@casl/ability": "6.5.0",
"@casl/react": "3.1.0",
"@emotion/cache": "11.10.8",
"@emotion/react": "^11.13.3",
"@emotion/server": "11.10.0",
"@emotion/styled": "^11.13.0",
"@fullcalendar/bootstrap5": "6.1.6",
"@fullcalendar/common": "5.11.4",
"@fullcalendar/core": "6.1.6",
"@fullcalendar/daygrid": "6.1.6",
"@fullcalendar/interaction": "6.1.6",
"@fullcalendar/list": "6.1.6",
"@fullcalendar/react": "6.1.6",
"@fullcalendar/timegrid": "6.1.6",
"@hookform/resolvers": "3.1.0",
"@iconify/react": "4.1.0",
"@material-ui/core": "^4.12.4",
"@material-ui/icons": "^4.11.3",
"@mui/icons-material": "^6.0.2",
"@mui/lab": "5.0.0-alpha.128",
"@mui/material": "^5.16.7",
"@mui/styled-engine-sc": "^6.0.0-alpha.10",
"@mui/system": "5.12.1",
"@mui/x-data-grid": "^6.0.3",
"@mui/x-date-pickers": "^6.18.6",
"@popperjs/core": "2.11.7",
"@reduxjs/toolkit": "1.9.5",
"antd": "^5.10.1",
"apexcharts-clevision": "3.28.5",
"axios": "1.4.0",
"axios-mock-adapter": "1.21.4",
"babel-eslint": "10.1.0",
"bootstrap-icons": "1.10.5",
"chart.js": "4.3.0",
"cleave.js": "1.6.0",
"clipboard": "^2.0.11",
"clipboard-copy": "4.0.1",
"clsx": "1.2.1",
"crypto-js": "^4.1.1",
"csv-loader": "^3.0.5",
"date-fns": "2.30.0",
"dayjs": "^1.11.10",
"dompurify": "^3.0.6",
"draft-js": "0.11.7",
"i18next": "22.4.15",
"i18next-browser-languagedetector": "7.0.1",
"i18next-http-backend": "2.2.0",
"install": "^0.13.0",
"js-cookies": "^1.0.4",
"jsonwebtoken": "8.5.1",
"jszip": "^3.10.1",
"keen-slider": "6.8.5",
"material-ui-dropzone": "^3.5.0",
"mui-file-input": "^4.0.3",
"next": "^14.0.3",
"nprogress": "0.2.0",
"payment": "2.4.6",
"prismjs": "1.29.0",
"react": "^18.2.0",
"react-apexcharts": "1.4.0",
"react-chartjs-2": "5.2.0",
"react-copy-to-clipboard": "^5.1.0",
"react-credit-cards": "0.8.3",
"react-csv": "^2.2.2",
"react-datepicker": "4.11.0",
"react-dom": "^18.2.0",
"react-draft-wysiwyg": "1.15.0",
"react-dropzone": "14.2.3",
"react-excel-renderer": "^1.1.0",
"react-hook-form": "7.43.9",
"react-hot-toast": "2.4.1",
"react-i18next": "12.2.2",
"react-loading-skeleton": "^3.3.1",
"react-perfect-scrollbar": "1.5.8",
"react-popper": "2.3.0",
"react-redux": "8.0.5",
"react-toastify": "^9.1.3",
"recharts": "2.5.0",
"sonner": "^1.0.3",
"styled-components": "^6.1.6",
"stylis": "4.1.4",
"stylis-plugin-rtl": "2.1.1",
"xlsx": "^0.18.5",
"yup": "1.1.1"
},
"devDependencies": {
"@iconify/iconify": "3.1.0",
"@iconify/json": "2.2.58",
"@iconify/tools": "2.2.6",
"@iconify/types": "2.0.0",
"@iconify/utils": "2.1.5",
"@typescript-eslint/eslint-plugin": "^5.59.0",
"@typescript-eslint/parser": "^5.59.0",
"eslint": "^8.38.0",
"eslint-config-next": "^13.3.0",
"eslint-config-prettier": "8.7.0",
"eslint-import-resolver-alias": "1.1.2",
"eslint-import-resolver-typescript": "3.5.3",
"eslint-plugin-import": "2.27.5",
"file-loader": "^6.2.0",
"prettier": "2.8.4"
},
"resolutions": {
"minipass": "5.0.0",
"@mui/x-data-grid/@mui/system": "5.12.1",
"react-credit-cards/prop-types": "15.7.2",
"@types/react": "17.0.83"
},
"overrides": {
"react-credit-cards": {
"react": "$react"
},
"@material-ui/core": {
"@types/react": "17.0.83"
},
"@mui/base": {
"@types/react": "18.2.0"
},
"@mui/lab": {
"@types/react": "18.2.0"
}
}
}
Adding errors
=> [internal] load build definition from Dockerfile 0.1s
=> => transferring dockerfile: 458B 0.0s
=> [internal] load metadata for docker.io/library/node:20.18.0-slim 0.7s
=> [internal] load .dockerignore 0.0s
=> => transferring context: 2B 0.0s
=> [1/6] FROM docker.io/library/node:20.18.0-slim@sha256:ec35a66c9a0a275b027debde05247c081f8b2f0c43d7399d3a6ad5660cee2f6a 9.8s
=> => resolve docker.io/library/node:20.18.0-slim@sha256:ec35a66c9a0a275b027debde05247c081f8b2f0c43d7399d3a6ad5660cee2f6a 0.0s
=> => sha256:ec35a66c9a0a275b027debde05247c081f8b2f0c43d7399d3a6ad5660cee2f6a 6.49kB / 6.49kB 0.0s
=> => sha256:14d0121de85b9625f9c6c827ab68f5c7ffb200758bc8693f7ea619b4946f07a9 1.93kB / 1.93kB 0.0s
=> => sha256:b39900045e39b0bc9cef501f84dd6361f20966a5c0af4e57e8829bc41a378144 6.77kB / 6.77kB 0.0s
=> => sha256:a480a496ba95a197d587aa1d9e0f545ca7dbd40495a4715342228db62b67c4ba 29.13MB / 29.13MB 0.5s
=> => sha256:07574ed847ca5d61db93432a04101864416f8c70edf119b5f1b301d9bfd54e47 3.31kB / 3.31kB 0.1s
=> => sha256:2291004efc7ad794b77febc45f712f96c2953217949484ed9a826aeb9d102089 40.76MB / 40.76MB 0.9s
=> => sha256:b991b65dcbd5011ac95d26285a1cb98bee28c5ee6a90a6955438818a2d42d786 1.71MB / 1.71MB 0.3s
=> => sha256:2816f5bc428c4887adb013037e9b297e9ee983a8427beef7fc38414888a79898 448B / 448B 0.4s
=> => extracting sha256:a480a496ba95a197d587aa1d9e0f545ca7dbd40495a4715342228db62b67c4ba 3.4s
=> => extracting sha256:07574ed847ca5d61db93432a04101864416f8c70edf119b5f1b301d9bfd54e47 0.0s
=> => extracting sha256:2291004efc7ad794b77febc45f712f96c2953217949484ed9a826aeb9d102089 4.8s
=> => extracting sha256:b991b65dcbd5011ac95d26285a1cb98bee28c5ee6a90a6955438818a2d42d786 0.1s
=> => extracting sha256:2816f5bc428c4887adb013037e9b297e9ee983a8427beef7fc38414888a79898 0.0s
=> [internal] load build context 269.6s
=> => transferring context: 1.29GB 269.2s
=> [2/6] WORKDIR /app 2.9s
=> [3/6] COPY package*.json ./ 1.6s
=> ERROR [4/6] RUN npm install 2.5s
------
> [4/6] RUN npm install:
2.383 npm error code ERESOLVE
2.383 npm error ERESOLVE could not resolve
2.383 npm error
2.383 npm error While resolving: @material-ui/core@4.12.4
2.383 npm error Found: @types/react@18.2.0
2.383 npm error node_modules/@types/react
2.383 npm error peerOptional overridden @types/react@"18.2.0" (was "^17.0.0 || ^18.0.0") from @mui/base@5.0.0-alpha.127
2.383 npm error node_modules/@mui/base
2.383 npm error @mui/base@"5.0.0-alpha.127" from @mui/lab@5.0.0-alpha.128
2.383 npm error node_modules/@mui/lab
2.383 npm error @mui/lab@"5.0.0-alpha.128" from the root project
2.383 npm error peerOptional @types/react@"^17.0.0 || ^18.0.0 || ^19.0.0" from @mui/icons-material@6.0.2
2.383 npm error node_modules/@mui/icons-material
2.383 npm error @mui/icons-material@"^6.0.2" from the root project
2.383 npm error 12 more (@mui/lab, @mui/material, @mui/system, ...)
2.383 npm error
2.383 npm error Could not resolve dependency:
2.383 npm error peerOptional overridden @types/react@"17.0.83" (was "^16.8.6 || ^17.0.0") from @material-ui/core@4.12.4
2.383 npm error node_modules/@material-ui/core
2.383 npm error @material-ui/core@"^4.12.4" from the root project
2.383 npm error peer @material-ui/core@"^4.0.0" from @material-ui/icons@4.11.3
2.383 npm error node_modules/@material-ui/icons
2.383 npm error @material-ui/icons@"^4.11.3" from the root project
2.383 npm error 1 more (material-ui-dropzone)
2.383 npm error 1 more (material-ui-dropzone)
2.383 npm error
2.383 npm error Conflicting peer dependency: @types/react@17.0.83
2.383 npm error node_modules/@types/react
2.383 npm error peerOptional overridden @types/react@"17.0.83" (was "^16.8.6 || ^17.0.0") from @material-ui/core@4.12.4
2.383 npm error node_modules/@material-ui/core
2.383 npm error @material-ui/core@"^4.12.4" from the root project
2.383 npm error peer @material-ui/core@"^4.0.0" from @material-ui/icons@4.11.3
2.383 npm error node_modules/@material-ui/icons
2.383 npm error @material-ui/icons@"^4.11.3" from the root project
2.383 npm error 1 more (material-ui-dropzone)
2.383 npm error 1 more (material-ui-dropzone)
2.383 npm error
2.383 npm error Fix the upstream dependency conflict, or retry
2.383 npm error this command with --force or --legacy-peer-deps
2.383 npm error to accept an incorrect (and potentially broken) dependency resolution.
2.383 npm error
2.383 npm error
2.383 npm error For a full report see:
2.383 npm error /root/.npm/_logs/2024-10-19T01_00_48_143Z-eresolve-report.txt
2.387 npm notice
2.387 npm notice New minor version of npm available! 10.8.2 -> 10.9.0
2.387 npm notice Changelog: https://github.com/npm/cli/releases/tag/v10.9.0
2.387 npm notice To update run: npm install -g npm@10.9.0
2.387 npm notice
2.387 npm error A complete log of this run can be found in: /root/.npm/_logs/2024-10-19T01_00_48_143Z-debug-0.log
------
Dockerfile:11
--------------------
9 |
10 | # Install dependencies
11 | >>> RUN npm install
12 |
13 | # Copy the rest of the application code
--------------------
ERROR: failed to solve: process "/bin/sh -c npm install" did not complete successfully: exit code: 1
Seeing the error message would help but, from what I can tell right away you'll have to do the following:
1.) Fix Dockerfile
# Use the official Node.js slim image as a base
FROM node:20.18.0-slim
# Set the working directory
WORKDIR /app
# Copy the rest of the application code - a single copy should be enough
# unfortunately, when using multiple COPY commands the next command overrides what was copied prior. If you want to copy all contents a single copy should be enough, if you want to transfer specify files then `ADD` would be better
COPY . . # single copy will grab everything in the current directory
# Install dependencies
RUN npm install
# Build the Next.js app
RUN npm run build
# Expose the port the app runs on
EXPOSE 3000
# Start the Next.js app
CMD ["npm", "start"]
2.) You'll need to define a .dockerignore file, with it you can set the context when building your container and in this case. An empty file will set the context to the current project directory. This combined with the single copy command should resolve transferring project files and directories. NOTE: You would ultimately, specify file or directories you want to "ignore"
ANWSER UPDATE:
I see you added error logs. If you review further down looks like you have conflicting dependencies. This looks to be the issue, making a node + react dependency issue then a docker issue.