Błąd kompilacji przy użyciu funkcji Component Lab> Autouzupełnianie dla ikon SVG w interfejsie użytkownika materiału

Podczas uruchamiania projektu w przeglądarce wystąpił następujący błąd:

Nie udało się skompilować:

./node_modules/@material-ui/lab/esm/internal/svg-icons/Close.js
Attempted import error: 'createSvgIcon' is not exported from '@material-ui/core/utils'.

Próbuję zaimplementować składnik autouzupełniania (z przykładu w sekcji „Wiele wartości”).

Oto kod, którego używam:

import React from 'react';
import Chip from '@material-ui/core/Chip';
import Autocomplete from '@material-ui/lab/Autocomplete';
import TextField from '@material-ui/core/TextField';

<Autocomplete
        multiple
        id="tags-standard"
        options={top100Films}
        getOptionLabel={(option) => option.title}
        defaultValue={[top100Films[13]]}
        renderInput={(params) => (
          <TextField
            {...params}
            variant="standard"
            label="Multiple values"
            placeholder="Favorites"
          />
        )}
      />

Próbowałem zainstalować ikony SVG firmy NPM:

npm install @material-ui/icons

A następnie importuję je do mojego TypeScript:

import createSvgIcon from '@material-ui/icons/utils/createSvgIcon';

Ale nadal mam powyższy błąd. Jak mogę rozwiązać ten problem?

Czy możesz spróbować zaktualizować @material-ui/core, uruchamiając

npm update

Jak opisano w materiale-UI projektu rejestr zmian w najnowszej wersji (co jest v4.9.9 czasie piszę tę odpowiedź), nastąpiła zmiana związanacreateSvgIcon

Pełną rozmowę zespołu można znaleźć tutaj .

Kiedy napotkałem problem?

Podczas uruchamiania projektu React chciałem użyć komponentu autouzupełniania@material-ui/lab .

Jak to rozwiązałem?

I uaktualniony @material-ui/corepakiet v4.9.9 poleceniem:

yarn upgrade @material-ui/core --latest