node_modules/@types/ 处出错(接口 'Element' 不能同时扩展类型 'ReactElement<any>)
Error at node_modules/@types/ (Interface 'Element' cannot simultaneously extend types 'ReactElement<any>)
在构建步骤中,我在 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
- yarn 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>'.
我前段时间遇到了同样的问题,与./node_modules/@types
无关。使用 nvm
- 节点版本管理器并完全清除 node
、npm
、yarn
及其全局包解决了我的问题。
卸载 Node.js 和 NPM 需要 a lot of steps, that's why I recommend using an automated solution such as node-reinstall script
。
git clone git@github.com:brock/node-reinstall.git
cd node-reinstall
./node-reinstall
这将删除所有包并完全删除 Node.js 和 NPM,并将其替换为节点版本管理器。如果安装成功,您将能够看到类似这样的内容:
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_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
- yarn 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>'.
我前段时间遇到了同样的问题,与./node_modules/@types
无关。使用 nvm
- 节点版本管理器并完全清除 node
、npm
、yarn
及其全局包解决了我的问题。
卸载 Node.js 和 NPM 需要 a lot of steps, that's why I recommend using an automated solution such as node-reinstall script
。
git clone git@github.com:brock/node-reinstall.git
cd node-reinstall
./node-reinstall
这将删除所有包并完全删除 Node.js 和 NPM,并将其替换为节点版本管理器。如果安装成功,您将能够看到类似这样的内容:
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