Specify multiple type definitions files in package.json

Question

I'm working on creating type definitions for a node library[1] but I'm having troubles with organising the files.

I've added the typings field to the package.json and that works great, the problem that I have is that I'd like to specify multiple type definition files since the library itself is split in two entry points:

• styled-components
• styled-components/native

So I have created type definitions for both the entry points but I'm unsure on how to make use of the typings field correctly. This is the structure I have (I'm only including what's relevant):

├── index.js
├── native.js
├── package.json
├── typings
│   ├── styled-components-native-test.tsx
│   ├── styled-components-native.d.ts
│   ├── styled-components-test.tsx
│   └── styled-components.d.ts

In styled-components.d.ts I have the main definitions, that should be loaded be doing import styled from "styled-components". In styled-components-native.d.ts I have the definitions for the native entrypoint, that should be loaded be doing import { x } from "styled-components/native".

The typings field inside the package.json is pointing to typings/styled-components.d.ts, but this doesn't make the styled-components-native.d.ts definitions available.

I've also tried to have an index.d.ts and referencing (with the triple slash notation) the other two files, but it didn't work.

So is there a way to achieve this?

[1] here's my PR https://github.com/styled-components/styled-components/pull/152

Answer 1

Try:

├── index.js
├── index.d.ts
├── native.js
├── native.d.ts

This should work correctly, as this is how packages like @angular/material bundle their types for such imports.

Basically the typescript compiler will look for a .d.ts file of the same name as the javascript file.

(Edit: sorry didn't realize this question was so old... will leave the answer here anyway in case it helps someone)