DEV Community

How to: Enable JavaScript auto-import suggestions in VS Code

Shane Mitchell on March 09, 2022

Auto-import problems If you work on JavaScript projects in VS Code, you’ve almost certainly been frustrated with the hit-or-miss natur...
Collapse
 
emarubi profile image
emarubi

I'm a software engineer too and I use TypeScript, React.js, and Node.js daily.
Thanks for this article who helped me to solve this automatic import in Vs Code issue.

May I ask you which font and theme you use in Vs Code?
I saw it many times in tutos and I would like to have it :)

Have a nice day!
Emanuela

Collapse
 
ostgals profile image
Andrejs Kuzmins

Cobalt2 by Wes Bos

Collapse
 
shanesc profile image
Shane Mitchell

Glad it helped!

Like Andrejs said, the theme is Cobalt2 and the font is Operator Mono. Fira Mono is another similar, free mono spaced font :)

Collapse
 
jaboulos profile image
ghostagent

Nice, helpful and to the point

Collapse
 
zonaguillermo profile image
Zona Guillermo

Hi Shane,

After reading your post I have a doubt. In the last line of your script:

"exclude": ["node_modules", "**/node_modules/*"]
Enter fullscreen mode Exit fullscreen mode

Shouldn't it be "node_modules/**/*" instead of "**/node_modules/*" ?

Collapse
 
shanesc profile image
Shane Mitchell

Hi @zonaguillermo, thanks for reading :)

This is the suggested pattern from the VS Code docs.

It is supposed to exclude any node_modules folders at any depth, not just the root level node_modules folder (see this stack overflow post.

TBH I'm not entirely sure when this case would come up, but it certainly won't hurt to include it, since you wouldn't want Intellisense to be searching any node_modules folders.

It's likely that "exclude": ["node_modules"] is sufficient though.

Collapse
 
rogue_paradigms profile image
Rogue Paradigms

For anyone reading in the future, "**/node_modules/*" helps when you have sub-directories/sub-projects that have their own node_modules [and package.json]

Collapse
 
zonaguillermo profile image
Zona Guillermo

Thanks Shane for de response,

I read these post and I see it more clearly now

Collapse
 
sergo profile image
Sergo • Edited

I'm using TailwindCSS, so after creating jsconfig.json I had an issue:

Cannot find module 'tailwindcss'. Did you mean to set the 'moduleResolution' option to 'nodenext', or to add aliases to the 'paths' option?'

If I delete "module": "ES6", the error will disappear.

Collapse
 
sergo profile image
Sergo

I don't know why, but if you add the string into jsconfig.json:

"include": ["src//*.js", "src//*.jsx"],

it will work.
This can be helpful -> github.com/romansndlr/react-vite-r...

Collapse
 
rita_hlinska_607c96554237 profile image
Rita Hlinska • Edited

Doesn't work. I am using Vue.js
Image description

Image description