Ошибка в node_modules / @ types / (интерфейс 'Element' не может одновременно расширять типы 'ReactElement <any>)

Я получаю несколько ошибок типа React.js в node_module на этапе сборки:

  1. TS2320: Interface 'Element' cannot simultaneously extend types 'ReactElement<any>' and 'ReactElement<any>'. Named property 'type' of types 'ReactElement<any>' and 'ReactElement<any>' are not identical.
  2. S2320: Interface 'ElementClass' cannot simultaneously extend types 'Component<any, {}, any>' and 'Component<any, {}, any>'. Named property 'props' of types 'Component<any, {}, any>' and 'Component<any, {}, any>' are not identical.
  3. TS2300: Duplicate identifier 'LibraryManagedAttributes'.
  4. TS2717: Subsequent property declarations must have the same type. Property 'a' must be of type 'DetailedHTMLProps<AnchorHTMLAttributes<HTMLAnchorElement>, HTMLAnchorElement>', but here has type 'DetailedHTMLProps<AnchorHTMLAttributes<HTMLAnchorElement>, HTMLAnchorElement>'.

Сначала я подумал, что проблема связана с нефиксированными версиями пакетов, поэтому я нашел рабочий проект, использующий те же пакеты, и отредактировал свой файл package.json, чтобы использовать точную версию. - Не помогло.

Затем я попросил своего коллегу сделать это на его машине, и это сработало! Поэтому я настроил node, npm и yarn, чтобы они соответствовали одинаковым версиям. - Не помогло.

После этого я полностью удалил node, npm, yarn и переустановил их. Хотя это тоже не устранило проблему.

Моя текущая настройка:

  • узел v10.9.0
  • npm v6.2.0
  • пряжа v1.9.4

package.json:

  "devDependencies": {
    "@babel/core": "^7.0.0-rc.1",
    "@babel/plugin-transform-typescript": "^7.0.0-rc.1",
    "@babel/preset-env": "^7.0.0-rc.1",
    "@babel/preset-react": "^7.0.0-rc.1",
    "@commitlint/cli": "^7.0.0",
    "@commitlint/config-conventional": "^7.0.1",
    "@types/react": "^16.4.12",
    "@types/react-dom": "^16.0.7",
    "@types/react-router-dom": "^4.3.0",
    "awesome-typescript-loader": "^5.2.0",
    "babel-loader": "^8.0.0-beta",
    "commitizen": "^2.10.1",
    "commitlint": "^7.0.0",
    "css-loader": "^1.0.0",
    "cz-customizable": "^5.2.0",
    "extract-text-webpack-plugin": "4.0.0-beta.0",
    "html-webpack-plugin": "^3.2.0",
    "husky": "^0.14.3",
    "node-sass": "^4.9.3",
    "sass-loader": "^7.1.0",
    "source-map-loader": "^0.2.4",
    "standard-version": "^4.4.0",
    "style-loader": "^0.22.1",
    "typescript": "^3.0.1",
    "webpack": "^4.16.5",
    "webpack-cli": "^3.1.0",
    "webpack-dev-server": "^3.1.5"
  },
  "dependencies": {
    "@material-ui/core": "^1.5.1",
    "react": "^16.4.2",
    "react-dom": "^16.4.2",
    "react-router-dom": "^4.3.1"
  }

tsconfig.json:

{
    "compilerOptions": {
        "outDir": "./dist/",
        "sourceMap": true,
        "noImplicitAny": true,
        "module": "commonjs",
        "target": "esnext",
        "jsx": "react"
    },
    "include": [
        "./src/**/*"
    ]
}

Список ошибок:

ERROR in [at-loader] ./node_modules/@types/react/index.d.ts:2305:19
    TS2320: Interface 'Element' cannot simultaneously extend types 'ReactElement<any>' and 'ReactElement<any>'.
  Named property 'type' of types 'ReactElement<any>' and 'ReactElement<any>' are not identical.

ERROR in [at-loader] ./node_modules/@types/react/index.d.ts:2306:19
    TS2320: Interface 'ElementClass' cannot simultaneously extend types 'Component<any, {}, any>' and 'Component<any, {}, any>'.
  Named property 'props' of types 'Component<any, {}, any>' and 'Component<any, {}, any>' are not identical.

ERROR in [at-loader] ./node_modules/@types/react/index.d.ts:2312:14
    TS2300: Duplicate identifier 'LibraryManagedAttributes'.

ERROR in [at-loader] ../../../node_modules/@types/react/index.d.ts:2326:13
    TS2717: Subsequent property declarations must have the same type.  Property 'a' must be of type 'DetailedHTMLProps<AnchorHTMLAttributes<HTMLAnchorElement>, HTMLAnchorElement>', but here has type 'DetailedHTMLProps<AnchorHTMLAttributes<HTMLAnchorElement>, HTMLAnchorElement>'.
Стоит ли изучать PHP в 2026-2027 годах?
Стоит ли изучать PHP в 2026-2027 годах?
Привет всем, сегодня я хочу высказать свои соображения по поводу вопроса, который я уже много раз получал в своем сообществе: "Стоит ли изучать PHP в...
Поведение ключевого слова "this" в стрелочной функции в сравнении с нормальной функцией
Поведение ключевого слова "this" в стрелочной функции в сравнении с нормальной функцией
В JavaScript одним из самых запутанных понятий является поведение ключевого слова "this" в стрелочной и обычной функциях.
Приемы CSS-макетирования - floats и Flexbox
Приемы CSS-макетирования - floats и Flexbox
Здравствуйте, друзья-студенты! Готовы совершенствовать свои навыки веб-дизайна? Сегодня в нашем путешествии мы рассмотрим приемы CSS-верстки - в...
Тестирование функциональных ngrx-эффектов в Angular 16 с помощью Jest
В системе управления состояниями ngrx, совместимой с Angular 16, появились функциональные эффекты. Это здорово и делает код определенно легче для...
Концепция локализации и ее применение в приложениях React ⚡️
Концепция локализации и ее применение в приложениях React ⚡️
Локализация - это процесс адаптации приложения к различным языкам и культурным требованиям. Это позволяет пользователям получить опыт, соответствующий...
Пользовательский скаляр GraphQL
Пользовательский скаляр GraphQL
Листовые узлы системы типов GraphQL называются скалярами. Достигнув скалярного типа, невозможно спуститься дальше по иерархии типов. Скалярный тип...
4
0
3 054
1
Перейти к ответу Данный вопрос помечен как решенный

Ответы 1

Ответ принят как подходящий

У меня была такая же проблема некоторое время назад, и она не имеет ничего общего с ./node_modules/@types. Использование nvm - диспетчера версий узла и полное удаление node, npm, yarn и их глобальных пакетов устранило мою проблему.

Удаление Node.js и NPM занимает довольно много много шагов, поэтому я рекомендую использовать автоматизированное решение, такое как node-reinstall script.

git clone [email protected]:brock/node-reinstall.git
cd node-reinstall
./node-reinstall

Это удаляет все пакеты и полностью удаляет Node.js и NPM и заменяет его диспетчером версий узла. Если установка прошла успешно, вы увидите что-то вроде этого:

nvm --version // 0.33.11

Если вы использовали Homebrew для установки yarn, просто выполните brew uninstall yarn, иначе yarn уже удален из вашей системы.

Теперь вам нужно позаботиться о yarn пакеты. cd в ~/.config/yarn/global и удалите node_modules, package.json и yarn.lock.

Вот и все, все удалено, и вы готовы к установке Node и NPM с nvm. Для этого введите:

 nvm install node

Он загрузит, скомпилирует и установит последнюю версию Node и NPM.
. Теперь проверьте все с помощью:

node -v
npm -v

Другие вопросы по теме