Question

在构建步骤期间，我在node_module遇到多个React.js类型错误：

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.
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.
TS2300: Duplicate identifier 'LibraryManagedAttributes'.
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>'.

Answer 1

前段时间我遇到了同样的问题，与./node_modules/@types无关。使用nvm-节点版本管理器，以及对node，npm，yarn及其全局软件包的完整擦除，解决了我的问题。

卸载Node.js和NPM需要花费a lot of steps，这就是为什么我建议使用诸如node-reinstall script之类的自动化解决方案的原因。

git clone git@github.com:brock/node-reinstall.git
cd node-reinstall
./node-reinstall

这将删除所有软件包，并完全删除Node.js和NPM并将其替换为Node Version Manager。如果安装成功，您将看到以下内容：

nvm --version // 0.33.11

如果使用Homebrew安装yarn，则只需执行brew uninstall yarn，否则yarn已从系统中删除。

现在，您将必须处理yarn packages。 cd至~/.config/yarn/global，然后删除node_modules，package.json和yarn.lock。

就是这样，所有内容都已删除，您可以使用nvm安装Node和NPM。为此，请输入：

 nvm install node

它将下载，编译和安装最新版本的Node和NPM。
现在使用以下命令检查所有内容：

node -v
npm -v

node_modules / @ types /上的错误（接口“元素”不能同时扩展类型“ ReactElement <any>”）

1 个答案: