javascriptvisual-studio-codejavascript-intellisense

How do I get VSCode to recognize current package Javascript imports?


VSCode intellisense is great, when I import a javascript function like

import func from './file';

vs code will give me a helpful dialog with its arguments from jsdoc. This is because I'm using a relative file path.

However, if I'm working with my current package, lets call it "public" as listed in my package.json, and try to reference a file using its absolute path, the intellisense doesn't pick up on the file.

// import the same file as above, but using absolute path
// public is the name of the current npm package
import func from 'public/subfolder/file'; 

intellisense no longer appears.

Is this a bug or a configuration issue?


Solution

  • Step1

    Create a jsconfig.json file to indicate a JavaScript project within vs code, just go to the bottom of vs code and click on green bulb icon.

    It will ask you to create jsconfig.json. Create jsconfig.json file which will contain the following code.

    //jsconfig.json
    {
     // See https://go.microsoft.com/fwlink/?LinkId=759670
     // for the documentation about the jsconfig.json format
     "compilerOptions": {
     "target": "es6",
     "module": "commonjs",
     "allowSyntheticDefaultImports": true
     },
     "exclude": [
     "node_modules",
     "bower_components",
     "jspm_packages",
     "tmp",
     "temp"
     ]
    }
    

    enter image description here

    Step2 enter image description here Install typings globally for downloading TypeScript Definition files (typings) for node modules like express, mongoose, angular etc.

    npm install typings --global

    TypeScript definition files are written in TypeScript to provide a VS IntelliSense experience for the functions and it's parameters. Let's install typings for express as given below:

    typings insall dt~express --global

    Let's try the coding experience for express. You will see the great intelliSense for express.

    enter image description here