Reactタイプ定義ファイル(外部モジュールを使用して宣言されている)があります。 私のソースファイルでは、通常、次のことを行います。
import * as R from "react"
そして、強く型付けされた方法でR.createElement(...
などを楽しく使用できます。 私もできます:
let _r = R;
_r.createElement(...
私が欲しいのは、すべてのファイルにRをインポートする必要はなく、代わりにグローバル宣言として持つことです(はい、いくつかの変数でグローバル名前空間を汚染するつもりです)。 私は.d.ts
試しました:
import * as React from "react";
declare var R : React;
これは機能しませんが、「名前 'React'が見つかりません」というメッセージが表示されます。 基盤となるreact.d.tsを変更せずに、モジュール全体をグローバルとしてエクスポートする別の方法はありますか?
import
宣言をソースファイルに追加すると、外部モジュールと見なされるため、これを行うことはできません。 グローバルを使用するReact定義ファイルを使用していない理由は何ですか?
https://github.com/borisyankov/DefinitelyTyped/blob/master/react/react-global.d.ts
これで問題が解決するように私には見えます。
私は実際にreact-global.d.ts
も試しましたが、これは明らかにReact
をグローバル空間に配置しますが、グローバルに名前を変更してTypescriptに通知するにはどうすればよいですか?
declare var _r = React; // error Cannot find name 'React';
私の実際のユースケースは、ユーティリティ/共通タイプのモジュールをグローバルスペースに持ち上げることができるため、それに到達するために多数の相対パスインポートを使用する必要がないことです。 これはJavascriptで実行できますが、Typescriptコンパイラに実行したことを通知する方法に苦労しています。
@ ahejlsberg-エッジケースについての私の
たとえば、 r.d.ts
宣言ファイルを作成できます。
/// <reference path="react-global.d.ts"/>
declare var R: typeof React;
そして、どこでもそのファイルを参照するだけです。 またはさらに良い:
/// <reference path="react-global.d.ts"/>
import R = React;
これにより、React asR.xxxから型を参照することもできます。
私はこれまでtypeof
使用を見たことがありません-かなりクールです。 これは、 .d.ts
から定義済みのモジュールには最適ですが、Typescriptで定義された外部モジュールをグローバルスペースに持ち上げて、Typescriptに認識させる方法がまだわかりません。 たぶんそれはアンチパターンであり、私はそれを乗り越える必要があるからです...
外部モジュールをサポートするためにtypeof
を拡張するようにいくつかのリクエスト(例:#2357)がありましたが、これまでのところ、この機能に対する需要はそれほど多くありません。
一般的に言って、プログラムは外部モジュールなしで書かれるか、外部モジュールだけで書かれます。 AMDブラウザアプリのブートストラップ部分を除いて、混合モデルでさえ可能な実行環境は実際にはありません。 そうです、それはほとんどアンチパターンです。
これについて私をユーモアを交えてくれてありがとう! 私は外部モジュールの調査を始めたばかりです(今後のAngular2およびAureliaフレームワークで遊ぶため)。 #17、#2338、#2839のような問題は、私が最終的に探しているものの多くのようです。 現在のプロジェクトを深く掘り下げていくうちに、より明確なフィードバックが得られることを願っています。
これはまだできませんか? TypeScriptをVueJSで使用しようとしていますが、グローバル名前空間にいくつかのものをインポートして、すべてのコンポーネントがそれらをインポートせずに使用できるようにしていただければ幸いです。 これを機能させるために進歩やハックはありましたか?
@Evertt
typescript 2.xxで明らかに機能する方法を見つけました。私の場合、ライブラリramdaをグローバルR
として公開したいと思います。
npm install ramda @types/ramda
typings/ramda.d.ts
typings
フォルダーを.tsconfig.jsonのインクルードに追加します。"include": [
"typings/**/*",
...
]
typings/ramda.d.ts
魔法を追加します:import * as _R from 'ramda';
export as namespace R;
export = _R;
これで、プロジェクト内のすべてのtsファイルは、入力されたグローバルR
があると想定しますが、これらのファイルにはそれ以上のインポートなどは一切行われません。
types/vue.d.ts
次のコードを使用してそれを実行しようとすると、 @ geekflyer :
import * as V from 'vue'
export as namespace Vue
export = V
そのグローバルVue
どこかで使用しようとすると、次のエラーが発生します。
error TS2686: 'Vue' refers to a UMD global, but the current file is a module. Consider adding an import instead.
ある時点でそのエラーも発生しましたか? もしそうなら、あなたはそれについて何をしましたか?
そのエラーが発生せず、なぜ私がそのエラーを発生させるのかわからない場合は、tsconfig.json全体、さらにはwebpack構成を表示してもらえますか?
こんにちは@Evertt確かに私も今このエラーが発生しています。 最初、私のソースコードはES6モジュール構文を使用していませんでしたが、いくつかのファイルをその構文にリファクタリングすると、同じエラーが発生しました。 調査を行いましたが、今は2番目のファイルglobals.d.ts
を作成し、それをtypingsフォルダーにも入れています。
import * as _R from 'ramda';
import * as _mobx from 'mobx';
declare global {
const R: typeof _R;
const mobx: typeof _mobx;
}
実際、このファイルだけでtypescriptコンパイラを「満たす」ように見えるので、理論的には、前述した他のファイルは必要ありません。 ただし、私の特定のケース(WebStormを使用しています)では、globals.d.tsファイルしかない場合、IDEは常にモジュールをインポートするようにpingを送信し、それらのグローバルの完了も不完全でした。 だから私は基本的に両方のファイルをtypescriptと私のIDEを満たすtypingsディレクトリに保存しました。 あまり良くありませんが、通常使用するいくつかのグローバルでは、これらのファイルを維持しても問題ないと思います。
これは私のtsconfig.json
です。
{
"compilerOptions": {
"target": "ES5",
"module": "amd",
"moduleResolution": "node",
"experimentalDecorators": true,
"lib": [
"ES6",
"DOM",
"ScriptHost"
],
"sourceMap": true,
"strictNullChecks": true
},
"include": [
"types/**/*",
"src/**/*"
]
}
バンドルにwebpackなどを使用していません。 個々のファイルをトランスパイルし、 https://github.com/SAP/openui5モジュールシステム(AMDに似ています)を介してロードし、本番用にのみバンドルします。
Typescriptのバージョンは:2.2.1
お役に立てば幸いです。
@geekflyerありがとうございました
最も参考になるコメント
こんにちは@Evertt確かに私も今このエラーが発生しています。 最初、私のソースコードはES6モジュール構文を使用していませんでしたが、いくつかのファイルをその構文にリファクタリングすると、同じエラーが発生しました。 調査を行いましたが、今は2番目のファイル
globals.d.ts
を作成し、それをtypingsフォルダーにも入れています。実際、このファイルだけでtypescriptコンパイラを「満たす」ように見えるので、理論的には、前述した他のファイルは必要ありません。 ただし、私の特定のケース(WebStormを使用しています)では、globals.d.tsファイルしかない場合、IDEは常にモジュールをインポートするようにpingを送信し、それらのグローバルの完了も不完全でした。 だから私は基本的に両方のファイルをtypescriptと私のIDEを満たすtypingsディレクトリに保存しました。 あまり良くありませんが、通常使用するいくつかのグローバルでは、これらのファイルを維持しても問題ないと思います。
これは私の
tsconfig.json
です。バンドルにwebpackなどを使用していません。 個々のファイルをトランスパイルし、 https://github.com/SAP/openui5モジュールシステム(AMDに似ています)を介してロードし、本番用にのみバンドルします。
Typescriptのバージョンは:2.2.1
お役に立てば幸いです。