I'm using WebStorm 2022.2 (Build #WS-222.3345.108). In an empty new project, I've added the ethers.js project as a custom third-party library. I've added the following HTML file to the project:
<!DOCTYPE html><html lang="en">
<head>
<title>Test</title>
<script type="text/javascript">
/** @type {Contract} */
let contract;
/** @type {ContractTransaction} */
let tx = contract.myMethod();
tx.wait();
</script>
<script src="index.js"></script>
</head>
<body></body></html>
In the embedded script, WebStorm does correctly provide the code-completion facilities for the variables whose types are annotated by the JSDoc; also, all of their corresponding fields and methods are correctly presented by the code-completion, colored appropriately, and Ctrl-Clicking the tokens guides to the declaration points (most of which being in .ts files); even the ContractTransaction, that is a TypeScript interface, a TypeScript concept that JavaScript lacks, works like a charm.
WebStorm does a great job in the HTML file, but when the identical code is put in an external JavaScript file (as in the second <script> tag with the src attribute in the HTML above), WebStorm ignores the TypeScript declarations altogether!
The aforementioned ignorance (ignoring the TypeScript declarations) in the index.js file, causes the following issues:
WebStorm believes the annotated type of
Contract(at line 1) is declared in thecontracts\lib\index.jsfile; ignoring the corresponding TypeScript declaration causes WebStorm to not to perceive that the class has an "index signature", which allows its objects to calmly expose any unforeseen properties; thus, it argues at line 4:Unresolved function or method myMethod()WebStorm complains about the
ContractTransactiontype annotation at line 3, arguing:
Unresolved variable or type 'ContractTransaction'(while it correctly spotted the corresponding declaration in the HTML file!)Weirdly enough, WebStorm correctly recognizes the declaration of the
wait()method at line 5; while in the previous entry, WebStorm argued it couldn't have found the type ofContractTransaction!! (only correctly & uninterestingly for our case, complains thatPromise returned from wait is ignored)
So, how to force the WebStorm to utilize the relative TypeScript insights (denoted by the JSDoc type annotations) in an external JavaScript file (to have it consider the TypeScript insights, just like what it did on the HTML file)?
