What to put in package.json types field for typescript based libs

TypeScript Project References

As far as I can tell, TypeScript Project References will fill your requirements:

  • VS Code navigation goes to the *.ts source file not to the *.d.ts file.
  • The package.json types value references the *.d.ts file.

That provides developer tooling without changing how/what you publish.

Demo

I created a simple demo project in GitHub. Here are the high-points of how to set up project references with code navigation.

package01

The tsconfig.json allows another TypeScript project to reference it (composite) and for code navigation to work (declarationMap). In the package.json, the NPM scope (@shaunluttin) is not entirely necessary; I included it to avoid naming collisions.

tsconfig.json

{
  "compilerOptions": {
    "target": "es5",
    "composite": true,
    "declarationMap": true
  }
}

package.json

{
  "name": "@shaunluttin/package01",
  "version": "1.0.0",
  "main": "index.js",
  "types": "index.d.ts"
}

package02

The tsconfig.json references package01. That’s what sets up the tooling. The package.json depends on package01 in the same way it normally would.

tsconfig.json

{
  "compilerOptions": {
    "target": "es5"
  },
  "references": [
    {
      "path": "../package01"
    }
  ]
}

package.json

{
  "name": "@shaunluttin/package02",
  "version": "1.0.0",
  "main": "index.js",
  "types": "index.d.ts",
  "dependencies": {
    "@shaunluttin/package01": "1.0.0"
  }
}

NPM Link

For local development, the two packages are connected with npm link.

cd package01
npm link

cd ../package01
npm link @shaunluttin/package01

Final Thoughts

The documentation mentions a handful of caveats that are too involved to list in this answer.

Leave a Comment