I'm trying to create a Visual Studio Code project from an existing website and I can't get IntelliSense to work properly. This is a pure HTML5/JavaScript ES5 website. I want to use VSCode to edit and debug under Chrome browser. This is our existing directory structure:
web/
Product1/
index.html
main.js
ui.js
Product2/
index.html
main.js
ui.js
lang/
lang_en.js
(other language files)
lib/
(third party js files)
shared/
shared1.js
shared2.js
(other shared js files)
We use a javascript compiler to render each product to an index.html.gz file and embed that file into our products to be served by our internal web server.
I installed VSCode and created a workspace file in web/. I also created jsconfig.json in web/Product1/. This is the content of the jsconfig.json:
{
"compilerOptions": {
"module": "commonjs",
"target": "es6"
},
"include": [
"../images/*",
"../lang/*",
"../lib/*",
"../shared/*"
]
}
I open shared1.js in the editor and right-click on an object that is defined in shared2.js and select "Go to definition", I get "No definition found for 'object'". If I open shared2.js and hover over the object definition, I get a brief "(loading...)" message. Once I do that, VSCode "Go to definition" will work between those files. If I exit VSCode and reopen the workspace, it can't find the object until I repeat this sequence. There are a lot of Google references to this problem but most give fixes that involve Node.js or Typescript. Nothing seems to work.
How do I get this to work every time?