[SOLVED] How could I solve Duplicate identifier 'DateType' Error on React/Typescript Building process

How could I solve Duplicate identifier 'DateType' Error on React/Typescript Building process

I am working with MUI lib, so that I have installed also the lib @mui/x-date-pickers, and I should install the lib @date-io/date-fns/ for my datepicker component work properly, but when I run yarn build I get this message error:

node_modules/@date-io/date-fns/type/index.d.ts:2:15 - error TS2300: Duplicate identifier 'DateType'.

2   export type DateType = Date;
            ~~~~~~~~
node_modules/@mui/x-date-pickers/node_modules/@date-io/date-fns/type/index.d.ts:2:15

2   export type DateType = Date;
                ~~~~~~~~
'DateType' was also declared here.

node_modules/@mui/x-date-pickers/node_modules/@date-io/date-fns/type/index.d.ts:2:15 - error TS2300: Duplicate identifier 'DateType'.

2   export type DateType = Date;
            ~~~~~~~~

node_modules/@date-io/date-fns/type/index.d.ts:2:15
2   export type DateType = Date;
                ~~~~~~~~
'DateType' was also declared here.


Found 2 errors in 2 files.

Errors  Files
     1  node_modules/@date-io/date-fns/type/index.d.ts:2
     1  node_modules/@mui/x-date-pickers/node_modules/@date-io/date-fns/type/index.d.ts:2

Solution

Step by step for solving the problem:

1. yarn remove @mui/x-date-pickers (this will remove x-date-picker which has a problem of compatibility on its version 5.0 beta)
1. yarn add @mui/lab (if you cant find how to install it, you should put on your package json file, inside of dependencies this "@mui/lab": "^5.0.0-alpha.74"
1. remove your node_module folder then run yarn install
1. Swap your imports from this: import { DatePicker } from '@mui/x-date-pickers/DatePicker' \ To this -> import { DesktopDatePicker } from "@mui/lab";