I have run into a situation where a type definition in node_modules/@types
is installing its own @types dependencies, and these \"nested\" @types conflict with
Use peerDependencies to ensure you only have one version of a dependency.
i.e. If I am using typings for angular and angular-mocks, angular-mocks will have its own @types/angular
@types/angular // => 1.5.8
@types/angular-mocks // => 1.5.8
@types/angular-mocks/node_modules/@types/angular // => *
To prevent two version of @types/angular
from being installed, declare @types/angular
as a peerDependency in your package.json file.
A solution I found for this was to specify the node_modules/@types
directory in the tsconfig.json
paths
setting.
Here's the snippet I changed in my tsconfig.json
, which you should be able to adapt for your use case. I needed to modify my baseUrl
and my paths
settings.
...
"baseUrl": ".",
"paths": {
"@/*": ["./src/*"],
"*": ["./node_modules/@types/*"]
}
...
In my case I'm using absolute urls in my TS project, so my local files are all relative to @/
. I think if you are not using an absolute url like that, you should have something like the following for your config:
...
"baseUrl": ".",
"paths": {
"*": ["./src/*", "./node_modules/@types/*"]
}
...
Here's my complete tsconfig.json
, which probably has a lot of irrelevant information, for reference.
{
"compilerOptions": {
"outDir": "./build/",
"sourceMap": true,
"allowJs": true,
"checkJs": true,
"jsx": "react",
"target": "es2017",
"module": "commonjs",
"moduleResolution": "node",
"allowSyntheticDefaultImports": true,
"strict": true,
"noUnusedLocals": true,
"noUnusedParameters": true,
"removeComments": false,
"preserveConstEnums": true,
"skipLibCheck": true,
"experimentalDecorators": true,
"esModuleInterop": true,
"baseUrl": ".",
"paths": {
"@/*": ["./src/*"],
"*": ["./node_modules/@types/*"]
}
},
"include": ["**/*", "*"],
"exclude": ["build", "node_modules", "coverage"]
}