Typescript: Cannot find type definition file for 'bin', 'src', 'test'

Viewed 1077

I'm brand new to the front-end and I'm likely very dumb. However, in a nutshell, if I do this

yarn add @mapbox/polyline

I suddenly get all kinds of helpful errors like this when I yarn start:

undefined
TypeScript error in undefined(undefined,undefined):
Cannot find type definition file for 'bin'.  TS2688

undefined
TypeScript error in undefined(undefined,undefined):
Cannot find type definition file for 'src'.  TS2688

index.js:1 undefined
TypeScript error in undefined(undefined,undefined):
Cannot find type definition file for 'test'.  TS2688

Ok cool. So I've royally broken this (git) branch (been there!), so let's just switch back to the working master branch... but yarn start yields the same errors on master now! It's as if the mere act of typing yarn add @mapbox/polyline corrupts something locally so badly that it's unrecoverable. I end up having to clone my repo again and start fresh.

(Since I'm using Typescript, I also tried adding types yarn add @types/mapbox__polyline... this does nothing to alleviate my pain.)

Any idea how to fix this?

3 Answers

This error happens because you have "garbage" inside node_modules/@types and/or your tsconfig.json is not configured properly. In order to understand exactly what's going on you need to know the following about TypeScript:

There are two fields in tsconfig.json related to this issue: "typeRoots" and "types"

{
  "compilerOptions": {
    "typeRoots": [],
    "types": []
  }
}

"typeRoots" specifies where TypeScript will be looking for "types" (I'll talk about what a type is shortly). If there is no "typeRoots" in tsconfig.json then TypeScript looks for types in node_modules/@types/.

So, what is considered a "type"? A type is a folder with index.d.ts file inside of it (or a folder with package.json inside of it specifying a different path/name to the type file).

"types" limits "typeRoots" by allowing TypeScript to look for types only into the folders which names are specified in "typeRoots". E.g. if your tsconfig.json contains:

{
  "compilerOptions": {
    ...
    "typeRoots": ['./node_modules/@types'],
    "types": ['aaaaaa'],
    ...
  },
  ...
}

then only ./node_modules/@types/aaaaaa will be used for types, and ./node_modules/@types/bbbbbb will be ignored (actually, it will be only partly ignored, only globals inside of it will be ignored, the other information about types inside of it will be used as usual).

So, in your case (assuming you don't have "typeRoots" in your tsconfig.json) it's very likely you get "Cannot find type definition file for" error because you have garbage (i.e. subdirectories that do not contain index.d.ts files) inside your node_modules/@types after running yarn add @mapbox/polyline. This would also explain why this error is not fixed when you switch git branches (because git doesn't track node_modules).

Just in case it helps anyone else, adding "types": [] to compilerOptions in tsconfig.json fixed it.

I have no clear idea why this works. I just decided to try the suggestion found in this bug report, which I'm not sure is related.

Typically you would add the @types\mapbox\polyline package. However the typings may not exist

If you want to suppress these (if the types don't exist) you can add a file to your project

mapbox-polyline.d.ts (or whichever name you choose as long as it ends with .d.ts)

with the current contents

declare module '@mapbox/polyline'

Update: I've tested adding this package and yarn add mapbox/polyline appears to import it. However the git repo says that polyline has been deprecated in favour of @mapbox/polyline so it's possible the typings authors havent caught up.

Update: I'd suggest to uninstall the packages you have right now, then reinstall with the latest version of @mapbox/polyline with yarn add @mapbox/polyline, then supress the typescrpt warnings by adding the ambient declaration above for now.

Related