diabetico
diabetico

Reputation: 317

Module not found: Can't resolve '@mui/lab/AdapterDateFns'

I was using the Material UI Timepicker but after updating to Material UI 5 it is not working anymore. I updated everything to @next and @material-ui/core (version 5.0.0-beta.5) and @material-ui/lab (version: 5.0.0-alpha.44).

Upvotes: 13

Views: 52038

Answers (7)

bubaigcect
bubaigcect

Reputation: 189

To fix this issue use below commend. It's worked for me.

npm install @mui/x-date-pickers

Upvotes: 0

Clinto Abraham
Clinto Abraham

Reputation: 367

As of Oct 2022, to fix this issue, use

npm i @mui/x-date-pickers

Read further more on dependencies requirement It supports 4 different date-libraries as of now. It is not mandatory to install all of them, choose as per project requirement

date-fns 
Day.js
Luxon
Moment.js

Elaborating on date-fns is like manipulating the results of MUI date-picker in required format

import { format, compareAsc } from 'date-fns'

format(new Date(2014, 1, 11), 'MM/dd/yyyy')
//=> '02/11/2014'

const dates = [
  new Date(1995, 6, 2),
  new Date(1987, 1, 11),
  new Date(1989, 6, 10),
]
dates.sort(compareAsc)
//=> [
//   Wed Feb 11 1987 00:00:00,
//   Mon Jul 10 1989 00:00:00,
//   Sun Jul 02 1995 00:00:00
// ]

Upvotes: 6

Mm Victory
Mm Victory

Reputation: 402

I had the same issue. What I did was installing date-fns as well

  npm i date-fns

I then stopped the localhost server and restart it again with npm start (I was using react)

npm start

Upvotes: 1

developer_sojib
developer_sojib

Reputation: 1

If after installing @mui/lab it doesn't work, You can add:

npm i @mui/material

Or

yarn add @mui/material

Upvotes: -1

Mady
Mady

Reputation: 1

install both npm i @mui/lab and npm i @mui/material

Upvotes: 0

Samira
Samira

Reputation: 2753

sometimes it just needs this :

yarn add @mui/lab

Upvotes: 3

NearHuscarl
NearHuscarl

Reputation: 81643

If you copy the Timepicker code from the MUI docs, you also need to install the lab package which contains the adapter code to integrate with date-fns. See the requirements here. For reference, you can see the package.json file from the live demo.

npm i @mui/lab

Upvotes: 39

Related Questions