How to set up VS Code to give auto-completion and hints for 3rd party javascript libraries embedded in the web page?

Viewed 349

I have a 3rd party library, numjs, included on a web page:

<html>
<head>
<script src="https://cdn.jsdelivr.net/gh/nicolaspanel/numjs@0.15.1/dist/numjs.min.js"></script>
<script src="./mycode.js" type="module"></script>
</head>
<body></body>

When I write code in mycode.js, using the embedded libraries in the web page, I want auto-completion, function documentation etc. to appear:

var a = nj.array([2,3,4]);
console.log(a);
// blah blah blah

There are two ways I have found to do this, but both have draw backs:

1. Use nodejs and some packaging library

If I install a library using node, VS Code recognizes it from the node_modules directory. So I can import it into my mycode.js and then hints etc. work.

var nj = require('numjs');
// blah blah blah

Drawback: Bundling library. Bundled code obfuscated. Learning a bundling library. I think it's too much work to change the compilation of the code just to get auto-completion.

2. Manually download/and serve 3rd party libraries

I can download the libraries to a local vendor/ directory. In the webpage, I change the source of the library script to vendor/library.js on my own server.


import * as nj from './vendor/numjs.js'
// blah blah blah

Drawback: Have to host/commit 3rd party library to repository.

3. Last resort - change imports during run-time

I do the same as 1, 2. Use require/import statements with node/manually downloaded libraries. But when I am about to run the code, I comment out the import statements because those libraries are already embedded in the html with an external source.

Drawbacks: Too manual.

How do I set up VS Code to get hints and auto-completion with 3rd party javascript libraries? Is there a way to do it without my writing my code for node and then compiling it for front-end?

0 Answers
Related