私はVSCodeを使用してJavaScriptプロジェクトに取り組んでいます。 UMD
デザインパターンを使用していますが、vscode intellisenseは別のファイルからのモジュールのエクスポートを認識できません。すべての宣言をglobals.d.ts
というファイルに追加しました。残念ながら、JavaScriptファイルからglobals.d.ts
宣言をロードする方法が見つかりませんでした。
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;
}));
typings
フォルダー、typings install "globals.d.ts"
などを作成するtypings.json
を使用してみました。これは、VSCodeで入力ファイルを開き、アプリを閉じて再度開いた後にのみ機能しました。これは、typings
ファイルを開いたままにしたときにのみ機能しました。これは、インターフェイス宣言を追加するのにあまり便利な方法ではありません。
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
動作に変化はありません。
この回答は主に Vitaliiの回答 によってコピー/インスピレーションを得ましたが、少し変更する必要があったため、プロジェクトで作業するために、この回答も追加しています。
私が外部コードを使用する各ファイルの上に、私は追加しました:
if (undefined) var { -List of Namespaces used- } = require("./globals");
未定義は、eslint
またはjshint
をトリガーせずに一定のfalse値を保持する(私が考えた)最短かつ最も単純な方法です。これにより、jsdocを「要求」しながら、コードが実行されることがなくなります。
var
またはlet
の代わりにconst
を使用しました。これは、ifスコープではなく、グローバルファイルスコープに留まるためです。
これは実際には{}
内の変数を(undefined
として)宣言しますが、typeof undeclared
とtypeof undefined
はどちらも"undefined"
であるため、違いはありませんコード。
1つのファイルにすべての宣言を含めることにより、1つのrequireステートメントを1行で分解することにより、すべての名前空間を取得できます。ただし、これが機能するためには、タイピングファイルでexport
ではなくdeclare
を使用する必要があることに注意してください。
JavaScriptファイルからglobals.d.ts
のインターフェースを表示できません。
export namespace Namespace {
export interface Interface {
property: string;
}
}
Interfaces
へのインターフェースで名前空間の名前を変更することによりこの問題を一時的に修正し(globals.d.ts
のすべての参照も修正)、インターフェースを実装する定数で別の名前空間を作成しました。
export namespace Interfaces {
export interface Interface {
property: string;
}
}
export namespace Namespace {
export const Interface: Interfaces.Interface;
}
また、JavaScriptコメントでglobals.d.ts
の名前空間を使用する際に問題が発生しました。この問題を解決するために、型の前に次のようにtypeof
を追加しました:/** @param {typeof Namespace.Interface} */
.d.ts
ファイルから.js
ファイルにインターフェースをエクスポートする方法を見つけました。答えは here です。
プレーンなNode.JSソリューション
次のファイルを作成します(名前は同じである必要があります):
lib.js
lib.d.ts
Lib.js内にコードを記述します。これを次のように言います。
function whenDo(params) {
return params;
}
module.exports = whenDo;
Lib.d.ts内でこれを書きます:
declare function wd(params: wd.Params): wd.Params;
declare namespace wd {
interface Params {
name: string;
}
}
export = wd;
次に、どこかにファイルを作成して、新しく作成した関数を使用し、次のコードを記述します。
const wd = require('./lib/lib');
const opt = wd({name:'drag13'});
console.log(opt.name);
ここからコードが盗まれた https://github.com/Drag13/WhenDo/blob/master/src/index.d.ts
babelを使用している人のためのES6インポート構文ソリューション
次のファイルを作成します(名前は同じである必要があります):
lib.js
lib.d.ts
Lib.js内にコードを記述します。これを次のように言います。
export const testMethod = (name, params) => params && params.age ? `hello ${name} with age: ${params.age}` : `hello ${name}`;
export const myConst = {
name: 'test',
age: 5
};
Lib.d.ts内でこれを書きます:
declare namespace MyModule {
interface IParams { age: number; }
function testMethod(name: string, params: IParams): string;
const myConst: {
name: string,
age: number
}
}
export = MyModule;
次に、どこかにファイルを作成して、新しく作成した関数を使用し、次のコードを記述します。
import { testMethod } from "./lib/lib";
const name = 'drag13';
const r = testMethod(name, { age: 5 });
console.log(r);
これで、intellisenseはparamsとresultに対して正常に機能するはずです。
しかし。このアプローチでは、node.jsとインポートをフレンドにバベルを使用する必要があります。コードをインポートスタイルから必須スタイルに変更しようとすると、型と引数は表示されますが、インテリジェンスは失敗します。
簡単なバベルチェック:
npm i babel-preset-env babel-cli
./node_modules/.bin/babel-node index.js --presets env
私のVsCodeバージョンは1.24.1です