Пример Material-ui-pickers: TypeError: Object(...) не является функцией

Question

Я пытаюсь настроить самый простой из возможных примеров выбора пользовательского интерфейса материала, используя пустой проект и следуя инструкциям по установке и использованию, описанным здесь: https://material-ui-pickers.dev/

Я получаю следующую ошибку:

TypeError: Object(...) is not a function
Module../node_modules/@material-ui/pickers/dist/material-ui-pickers.esm.js
node_modules/@material-ui/pickers/dist/material-ui-pickers.esm.js:25
  22 | import Tab from '@material-ui/core/Tab';
  23 | import Tabs from '@material-ui/core/Tabs';
  24 | import Paper from '@material-ui/core/Paper';
> 25 | var useStyles = makeStyles(function (theme) {
  26 |   var textColor = theme.palette.type === 'light' ? theme.palette.primary.contrastText : theme.palette.getContrastText(theme.palette.background.default);
  27 |   return {
  28 |     toolbarTxt: {

Шаги, которые я выполнил:

create-react-app material-ui-pickers-demo

yarn add @material-ui/core

yarn add @material-ui/pickers

yarn add @date-io/date-fns

import React, { useState } from "react";
import DateFnsUtils from "@date-io/date-fns"; // choose your lib
import {
  DatePicker,
  TimePicker,
  DateTimePicker,
  MuiPickersUtilsProvider,
} from "@material-ui/pickers";

function App() {
  const [selectedDate, handleDateChange] = useState(new Date());

  return (
    <MuiPickersUtilsProvider utils={DateFnsUtils}>
      <DatePicker value={selectedDate} onChange={handleDateChange} />
      <TimePicker value={selectedDate} onChange={handleDateChange} />
      <DateTimePicker value={selectedDate} onChange={handleDateChange} />
    </MuiPickersUtilsProvider>
  );
}

export default App;

yarn start

версия пряжи 1.16.0 версия узла v12.1.0

редактировать: я видел этот вопрос, и он не ответил на мой Uncaught TypeError: Object(...) не является функцией при импорте @material-ui/pickers

Answer 1

Причиной является неправильная версия @material-ui/core, @material-ui/pickers отлично работает только с @material-ui/core@v4.0.0-beta.1 теперь. @ material-ui / core beta 1 и @ material-ui / pickers слишком сырые, чтобы использовать их в проектах. Итак, чтобы решить вашу проблему, вам нужно выполнить следующие шаги:

Удалить node_modules каталог и запустить yarn add @material-ui/core@v4.0.0-beta.1и, наконец, запустить @material-ui/pickers@3.0.0-beta.1Это должно исправить ошибку.