I am working on JavaScript project using VSCode. I am using the UMD
design pattern and vscode intellisense cannot recognize the exports of a module from another file. I added all the declarations in a file called globals.d.ts
. Unfortunately I couldn't find a way to load the globals.d.ts
declarations from my JavaScript files.
export namespace ModuleName {
export interface Item {
toString(): string;
property: string;
name: string;
}
}
(function (global, factory) {
"use strict";
if (typeof ModuleName === "undefined" && typeof require === "function") global.ModuleName = require("./mymodule.js");
if (typeof exports !== "undefined" && typeof module !== "undefined") factory(exports);
else factory(global.OtherModule = global.OtherModule || {});
})(this, (function (exports) {
"use strict";
function myMethod() {
}
exports.myMethod = myMethod;
return exports;
}));
I tried using typings install "globals.d.ts"
which created the typings
folder, typings.json
etc. This was only working after opening the typings file in VSCode then closing and reopening the app. That only worked while I kept the typings
file open. This is not a very convenient way to add my interface declarations.
Version: 1.17.0
Shell: 1.7.7
Node: 7.9.0
Architecture: x64
Version: 1.24.1
Shell: 1.7.12
Node: 7.9.0
Architecture: x64
There is no change in behavior.
This answer was mostly copied/inspired by Drag13's answer, but since it had to be modified a bit, to work with my project, I am also adding this answer.
On top of each file where I use external code, I added:
if (undefined) var { -List of Namespaces used- } = require("./globals");
Undefined is the shortest and simplest way (that I thought of) of having a constant false value without triggering eslint
or jshint
. This ensures that the code will never be run, while still "requiring" the jsdoc.
I used var
instead of let
or const
since it will not stay in the if scope, but rather the global file scope.
This will actually declare the variables inside the {}
(as undefined
), but typeof undeclared
and typeof undefined
are both "undefined"
, thus there is no difference in the code.
By having all the declarations in one file, I can get all the namespaces by destructuring one require statement in one line.
But keep in mind, that in order for this to work, you need to be using export
and not declare
in your typings file.
I cannot view the interfaces in globals.d.ts
from JavaScript files.
export namespace Namespace {
export interface Interface {
property: string;
}
}
I have temporarily fixed this problem by renaming the namespace with the interfaces to Interfaces
(also fixed all the references in globals.d.ts
) and created another Namespace with constants that implement the interfaces, like so:
export namespace Interfaces {
export interface Interface {
property: string;
}
}
export namespace Namespace {
export const Interface: Interfaces.Interface;
}
I also had trouble using the namespaces from globals.d.ts
in JavaScript comments. To solve this problem I added typeof
infront of the type, like so: /** @param {typeof Namespace.Interface} */
I have now found a way to export interfaces from .d.ts
files to .js
files, you can find the answer here.