TypeScript typings give me "index.d.ts is not a module"

Question

I am getting File node_modules/@types/webrtc/index.d.ts is not a module with this code:

import * as webrtc from "webrtc";
const peerConnection1 = new RTCPeerConnection();

I have installed the typings using npm i @types/webrtc --save-dev. Hovering over RTCPeerConnection in const peerConnection1 = new RTCPeerConnection(); display type annotations in Visual Studio Code so at least the code editor sees the types. Running tsc (or webpack with ts-loader) fails with the error.

I have tried npm i webrtc --save in a misguided attempt for solving this, but it did not change anything and I really only want the typings anyway, WebRTC is right there in the browser, I don't need a package for that. (Support aside.)

The index.d.ts file indeed is not a module, it just references two other files with interfaces in them. So I thought to remove import * as webrtc from "webrtc"; hoping the typings will still be visible by tsc somehow. (But that's impossible since I exclude node_modules in TypeScript config file.) When I do that RTCPeerConnection is no longer recognized.

Adding /// <reference src="node_modules/@types/webrtc/" /> did not help, tsc says Invalid reference directive syntax.

You can view a repository with minimal repro here on GitLab. I am not too well versed in TypeScript typings acquisition so please forgive my ignorance if I'm going about this all wrong.

tayfun Kılıç · Accepted Answer · 2023-01-14 22:04:46Z

174

In vscode

Ctrl + Shift + p > Developer: Reload Window.

edited Jan 14, 2023 at 22:04

answered Dec 2, 2021 at 11:13

tayfun Kılıç

2,9531 gold badge16 silver badges14 bronze badges

Sign up to request clarification or add additional context in comments.

2 Comments

F.Fabian Over a year ago

Thanks a lot for the answer! Why does this work and restarting vsCode does not?

Naylor Over a year ago

Wow. I was having fits with VS Code giving this error about the React index.d.ts when my app was compiling just fine. Restarts of VS Code had no effect but this did. Wish I knew why.

Meirion Hughes · Accepted Answer · 2017-01-16 13:43:01Z

91

webrtc is part of the browser; you're trying to import a module. Simply import the (typings) library:

import "webrtc";

you may need to use "moduleResolution": "node" in the compiler options.

Alternatively use the "types": ["webrtc"] compiler option and the compiler will automatically load those types up for you.

edited Jan 16, 2017 at 13:43

answered Nov 5, 2016 at 17:52

Meirion Hughes

26.7k13 gold badges80 silver badges130 bronze badges

Comments

Daniel Rosenwasser · Accepted Answer · 2016-11-05 22:41:15Z

18

You probably want to add

"types": ["webrtc"]

to your tsconfig.json, or less preferrably, to use

/// <reference types="webrtc" />

in your source files. Here's an example of it in your tsconfig.json:

{
    "compilerOptions": {
        "target": "es5",
        "sourceMap": true,
        "noImplicitAny": true,

        "types": ["webrtc"]
    },
    "exclude": [
        "node_modules"
    ]
}

This tells TypeScript it should include webrtc declarations in your build

answered Nov 5, 2016 at 22:41

Daniel Rosenwasser

24.2k14 gold badges54 silver badges66 bronze badges

3 Comments

aendra Over a year ago

Don't set types or else only those types will get loaded — usually everything in node_modules/@types is loaded, and this will prevent that behaviour. You simply need to npm i @types/webrtc these days.

Daniel Rosenwasser Over a year ago

@aendrew that isn't entirely true because it depends on where your tsconfig.json is placed relative to your node_modules directory.

thephpdev Over a year ago

Yeah this just makes TS not load any other types, even for my local app modules it now spews out thousands of errors about missing types...

Sabir Hussain · Accepted Answer · 2017-07-05 08:25:17Z

11

No need to import anything, run following:

npm install --save @types/webrtc
update tsconfig.json -

"types": [ "@types/webrtc" ]

answered Jul 5, 2017 at 8:25

Sabir Hussain

1853 silver badges9 bronze badges

2 Comments

aendra Over a year ago

This will make it so that only the webrtc types are imported. Don't update tsconfig.json.

Nino Filiu Over a year ago

npm install --save-dev @types/... is preferred - normally, TS is not used in production

Karolis Grinkevičius · Accepted Answer · 2017-09-08 20:00:21Z

8

Another option is to add a new declaration file *.d.ts in your module, i.e.:

declare module 'my-module';

answered Sep 8, 2017 at 20:00

Karolis Grinkevičius

7236 silver badges9 bronze badges

Comments

andrewdotn · Accepted Answer · 2021-07-02 22:08:32Z

6

In my case, I was getting this error message with an index.d.ts file generated by the TypeScript compiler.

The problem was that I’d forgotten to specify any import or export declarations in the source .ts file. I removed the original module.export = {…} bit when porting from .js to .ts, and hadn’t yet replaced it.

This is how the docs define a ‘module’ (emphasis added):

In TypeScript, just as in ECMAScript 2015, any file containing a top-level import or export is considered a module. Conversely, a file without any top-level import or export declarations is treated as a script whose contents are available in the global scope (and therefore to modules as well).

Adding an export to the things I intended to export turned the index.d.ts into a module, clearing the error.

answered Jul 2, 2021 at 22:08

andrewdotn

35.3k10 gold badges110 silver badges134 bronze badges

1 Comment

Brett Zamir Over a year ago

Mine was related in that the generated file didn't have an export, but my issue was because I was using outFile with a ESM (NodeNext) module type. Switching to outDir fixed things for my issue.

Martin Oputa · Accepted Answer · 2022-08-31 12:02:32Z

4

I was getting similar error on VS code editor. Simply, closing and opening VSCode again solved the problem for me.

answered Aug 31, 2022 at 12:02

Martin Oputa

4535 silver badges6 bronze badges

2 Comments

Alexandru Trandafir Catalin Over a year ago

cant belive I didnt think of this (facepalm)

The Digital Ninja Over a year ago

Welp, this fixed it for me too

youngrrrr · Accepted Answer · 2017-12-13 20:32:19Z

2

/// <reference types="@types/<your_types_module>" />

You may or may not want to do this depending on your build and style needs, but this seems to be the quick (and dirty) fix.

answered Dec 13, 2017 at 20:32

youngrrrr

3,2843 gold badges30 silver badges43 bronze badges

Comments

score 1 · Accepted Answer · 2023-03-21 16:40:47Z

1

I got this error because I forked a library, renamed it in package.json but didn't rename this line in its .d.ts file (the file pointed to by "types": in package.json):

declare module "package-name" {

to

declare module "my-forked-package-name" {

edited Mar 21, 2023 at 16:40

answered Mar 21, 2023 at 15:54

user3064538

Comments

Rajantha Fernando · Accepted Answer · 2021-02-19 11:35:44Z

0

In my case it was a corrupted dependency, deleting the module and npm install did the work.

answered Feb 19, 2021 at 11:35

Rajantha Fernando

3084 silver badges12 bronze badges

1 Comment

Carmine Tambascia Over a year ago

This unfortunately could be a solution sometimes

Ion Scorobogaci · Accepted Answer · 2021-02-10 15:21:21Z

-6

use require

const webRtc = require('webrtc');

and you import should be good to go

answered Feb 10, 2021 at 15:21

Ion Scorobogaci

1652 silver badges5 bronze badges

Collectives™ on Stack Overflow

TypeScript typings give me "index.d.ts is not a module"

11 Answers 11

2 Comments

Comments

3 Comments

2 Comments

Comments

1 Comment

2 Comments

Comments

Comments

1 Comment

Comments

Your Answer

Linked

Hot Network Questions

Collectives™ on Stack Overflow

11 Answers 11

2 Comments

Comments

3 Comments

2 Comments

Comments

1 Comment

2 Comments

Comments

Comments

1 Comment

Comments

Your Answer

Sign up or log in

Post as a guest

Linked

Related