Docker/Next js :: Cannot find module '@mui/x-date-pickers/AdapterDateFns' or its corresponding type declarations

Question

When I build my application via npm run build , my next js app builds it successfully. There is no issue.

But when I build this in my docker file, I get This issue

#0 12.18 Type error: Cannot find module '@mui/x-date-pickers/AdapterDateFns' or its corresponding type declarations.
#0 12.18
#0 12.18   4 | import useupdateManifest from 'src/hooks/manifest/useUpdateManifest';
#0 12.18   5 | import { manifests } from 'src/types/manifest/manifests';
#0 12.18 > 6 | import { AdapterDateFns } from '@mui/x-date-pickers/AdapterDateFns';
#0 12.18     |                                ^
#0 12.18   7 | import { LocalizationProvider } from '@mui/x-date-pickers/LocalizationProvider';
#0 12.18   8 | import { MobileDatePicker } from '@mui/x-date-pickers/MobileDatePicker';#0 12.18   9 | import { branchVehicleStoreVar } from 'src/Store/branchVehicleStore';
------
failed to solve: executor failed running [/bin/sh -c npm run build]: exit code: 1

This is my package.json files dependencie list

"dependencies": {
    "@apollo/client": "^3.5.8",
    "@david.kucsai/react-pdf-table": "^0.4.1",
    "@emotion/react": "^11.7.1",
    "@emotion/styled": "^11.6.0",
    "@hookform/resolvers": "^2.8.8",
    "@material-ui/core": "^4.12.4",
    "@mui/icons-material": "^5.4.1",
    "@mui/lab": "^5.0.0-alpha.78",
    "@mui/material": "^5.4.1",
    "@react-md/autocomplete": "^5.1.2",
    "@react-pdf/renderer": "^2.1.1",
    "@tabler/icons": "^1.54.0",
    "@types/lodash": "^4.14.178",
    "date-fns": "^2.28.0",
    "deepmerge": "^4.2.2",
    "formik": "^2.2.9",
    "framer-motion": "^6.2.8",
    "graphql": "^16.3.0",
    "lodash": "^4.17.21",
    "material-ui-popup-state": "^2.0.0",
    "moment": "^2.29.2",
    "next": "12.0.10",
    "notistack": "^2.0.3",
    "print-js": "^1.6.0",
    "prop-types": "^15.8.1",
    "react": "17.0.2",
    "react-device-detect": "^2.1.2",
    "react-dom": "17.0.2",
    "react-hook-form": "^7.27.0",
    "react-infinite-scroll-component": "^6.1.0",
    "react-md": "^5.1.2",
    "react-perfect-scrollbar": "^1.5.8",
    "yup": "^0.32.11"
  },

Please help me. Thank you.

Dockerfile

# get the base node image
FROM node:alpine

# set the working dir for container
WORKDIR /app

# copy the json file first
COPY ./package.json .

# install npm dependencies
RUN npm install --force

# copy other project files
COPY . .

RUN npm run build

# Exposse port number
EXPOSE 8101

# build the folder
CMD ["npm", "run", "start" ]

docker-compose file

version: '3.8'
services: 
    frontend:
        build: .
        container_name: next_c
        ports: 
          - '8101:8101'
        stdin_open: true
        tty: true

.dockerignore file

/.next/
/node_modules

Answer 1

It seems you don't have @mui/x-date-pickers in the dependency list.