import { MuiPickersUtilsProvider } from '@material-ui/pickers'; でエラーが出る

Question

概要

Material-UIのdate-pickerを使うために、公式ドキュメントの通り実装しようとしたところ、
import { MuiPickersUtilsProvider } from '@material-ui/pickers';
を記述した時点でエラーが出てしまいました。
どのようにして解決すれば良いのかわからないため、教えていただきたいです。

ソースコード

import styled from "styled-components";
import { useState } from "react";
import { MuiPickersUtilsProvider } from '@material-ui/pickers';

const Container = styled.div`
  position: fixed;
  top: 0;
  z-index: 20;
  width: 100%;
  height: 50px;
  display: flex;
  border-bottom: 1px solid #dcdcdc;
  display: flex;
  justify-content: center;
  align-items: center;
  background-color: #ffff;
  @media(min-width: 600px) {
    height: 70px;
  }
`;

const Prev = styled.i`
  font-size: 25px;
  margin-right: 10px;
  cursor: pointer;
`;

const Next = styled.i`
  font-size: 25px;
  cursor: pointer;
`;

const Day = styled.div`
  margin: 0 40px;
  color: #0d0d0d;
`;

const Calendar = styled.i`
  font-size: 20px;
  cursor: pointer;
`;

const Header = (props) => {

  return (
    <Container>
      <Prev
        className="fas fa-angle-left"
        onClick={() => props.changeDay("prev")}
      >
      </Prev>
      <Next
        className="fas fa-angle-right"
        onClick={() => props.changeDay("next")}
      >
      </Next>
    </Container>
  );

}

export default Header;

エラーメッセージ

./node_modules/@material-ui/core/esm/Button/index.js
Error: ENOENT: no such file or directory, open '/Users/k20081kk/App-Project/Kiroku/client/node_modules/@material-ui/core/esm/Button/index.js'