How do you get type hinting for webext APIs in VSCode without using bundlers?

Add-ons Development
1

AFAIK, you can get type hinting for
WebExtension APIs by installing webextension-polyfill and @types/webextension-polyfill with npm and
import browser from "webextension-polyfill"; in js files.

Since you imported from a node module, you will also need to use a bundler to make the extension work in a browser environment.

Is there any other way to get type hinting, though? I don’t want to use a bundler just for type hinting. I don’t even need the polyfill for my homemade Firefox-only extension.

2

This is how it’s done in WebStorm (I’ve been using this long ago when I was still using JavaScript without bundler).
Maybe it will help you google it out for VSCode.

image
image979×521 32.6 KB

1 Like
3

Try @types/firefox-webext-browser

4

I don’t think you can do that in VSCode, but thank you anyway.

5

It worked! Thanks a lot.

6

How exactly do you make it work, @hyk?

Edit: Ran the given installation command npm install --save @types/firefox-webext-browser in a project folder, which added the types in a node_modules subfolder, and that was enough for VSCode. May need to remove and retype the //@ts-check line in project files to redo checks.