Error at node_modules/@types/react-dom/… Subsequent variable declarations must have the same type. Variable 'a'

Question

I have installed @types/react-dom along with typescript and @types/react and @types/meteor but when I try to run the typechecker from command line I get the below error

You can reproduce the error and see all my configuration here: https://github.com/Falieson/react15-meteor1.5

Thanks for your help!

$ meteor npm run type:client

> react-meteor-example@0.1.0 type:client /Users/sjcfmett/Private/ReactMeteorExample
> tslint -p ./tsconfig.json --type-check './client/**/*.{ts,tsx}'

Error at node_modules/@types/react-dom/node_modules/@types/react/index.d.ts:3422:13: Subsequent variable declarations must have the same type.  Variable 'a' must be of type 'DetailedHTMLProps<AnchorHTMLAttributes<HTMLAnchorElement>, HTMLAnchorElement>', but here has type 'DetailedHTMLProps<AnchorHTMLAttributes<HTMLAnchorElement>, HTMLAnchorElement>'.
Error at node_modules/@types/react-dom/node_modules/@types/react/index.d.ts:3423:13: Subsequent variable declarations must have the same type.  Variable 'abbr' must be of type 'DetailedHTMLProps<HTMLAttributes<HTMLElement>, HTMLElement>', but here has type 'DetailedHTMLProps<HTMLAttributes<HTMLElement>, HTMLElement>'.
Error at node_modules/@types/react-dom/node_modules/@types/react/index.d.ts:3424:13: Subsequent variable declarations must have the same type.  Variable 'address' must be of type 'DetailedHTMLProps<HTMLAttributes<HTMLElement>, HTMLElement>', but here has type 'DetailedHTMLProps<HTMLAttributes<HTMLElement>, HTMLElement>'.
Error at node_modules/@types/react-dom/node_modules/@types/react/index.d.ts:3425:13: Subsequent variable declarations must have the same type.  Variable 'area' must be of type 'DetailedHTMLProps<AreaHTMLAttributes<HTMLAreaElement>, HTMLAreaElement>', but here has type 'DetailedHTMLProps<AreaHTMLAttributes<HTMLAreaElement>, HTMLAreaElement>'.
... (shortened)

package.json (for reference)

{
  "name": "react-meteor-example",
  "version": "0.1.0",
  "private": true,
  "scripts": {
    "start": "meteor run",
    "lint:client": "tslint --fix -c ./tslint.json -p ./tsconfig.json './client/**/*.{ts,tsx}'",
    "lint:imports": "tslint --fix -c ./tslint.json -p ./tsconfig.json './imports/**/*.{ts,tsx}'",
    "lint:server": "tslint --fix -c ./tslint.json -p ./tsconfig.json './server/**/*.ts'",
    "lint": "npm run lint:client && npm run lint:server && npm run lint:imports",
    "type:imports": "tslint -p ./tsconfig.json --type-check './imports/**/*.{ts,tsx}'",
    "type:client": "tslint -p ./tsconfig.json --type-check './client/**/*.{ts,tsx}'",
    "type:server": "tslint -p ./tsconfig.json --type-check './server/**/*.ts'",
    "type": "npm run type:client && npm run type:server && npm run type:imports",
    "precommit": "npm run lint && npm run type"
  },
  "dependencies": {
    "babel-runtime": "^6.20.0",
    "meteor-node-stubs": "~0.2.4",
    "react": "^15.6.1",
    "react-dom": "^15.6.1"
  },
  "devDependencies": {
    "@types/meteor": "^1.4.2",
    "@types/react": "^15.6.0",
    "@types/react-dom": "^15.5.1",
    "babel-preset-react": "^6.24.1",
    "babel-preset-stage-1": "^6.24.1",
    "husky": "^0.14.3",
    "tslint": "^5.5.0",
    "tslint-react": "^3.1.0",
    "typescript": "^2.4.2"
  }
}

Answer 1

The types for React 16 beta have been published as the 'latest' React types.

The new version removes the definitions for the parts of React that have been removed in React 16 (like React.DOM), which is expected.

Unfortunately, the publishing of these types for the React 16 beta were done to the @latest (default) tag in npm instead of @next (as React did).

I have an open issue (#18708) with DefinitelyTyped here: https://github.com/DefinitelyTyped/DefinitelyTyped/issues/18708

You can try specifically targeting a particular release (npm install --save @types/react@15.6.0) but the dependencies in @types/react-dom for @types/react is set to "*", which seems to cause @types/react@latest to still be downloaded, causing you to have multiple versions in various places of your node_modules directory.

We are having to do some manual work to sort this out. Hopefully the folks maintaining @types/react will fix this soon.

Answer 2

I am using yarn, and fixed this by running rm -rf node_modules && rm yarn.lock && yarn install