skip to Main Content

I’m using VSCode for web development and I noticed that there is no JavaScript autocomplete/IntelliSense for browser-related types such as Element nor functions such as document.querySelector(). Is there an extension for this that anyone has found?

// tsconfig.json
{
    "compileOnSave": true,
    "compilerOptions": {
        "alwaysStrict": true,
        "checkJs": true,
        "outDir": "./root/js",
        "rootDir": "./src",
        "target": "ESNext"
    },
    "exclude": ["./root/**/*"],
    "include": ["./src/**/*"]
}

I was starting to type out document.querySelector() and noticed halfway through that autocomplete wasn’t triggering. I triggered it manually (Ctrl-I) and got no suggestions.

For clarification, I’m looking for something that will do this, but with frontend code:
Screenshot of VSCode IntelliSense at work on a Discord.js project

Tried searching for extensions in marketplace, on Google, in VSCode itself – to no avail.

2

Answers


  1. Chosen as BEST ANSWER

    Turns out @user was right — I needed to add this to my tsconfig.json:

    {
      "lib": [
        "DOM"
      ]
    }
    

  2. The issue is that the lib field (tsconfig.json or jsconfig.json) hasn’t been set to include "dom", which tells the TypeScript compiler (and VS Code’s TypeScript support) to include types for web APIs like the DOM.

    Fun fact: If you leave the lib field empty, TypeScript will assume certain things to be in it "by default". For more info on that, see this answer I wrote to "How can I make vscode assume a node.js context, so that it doesn’t assume fetch exists?"

    Login or Signup to reply.
Please signup or login to give your own answer.
Back To Top
Search