
導入
文脈をするだけ, 、 Typescript 厳密に型指定された構造を使用してコードを記述して、このコンパイルされたコードを純粋な java スクリプトの設定をすることができます。. 既に、 Visual Studio コード Microsoft によって作成されたマルチプラット フォーム エディター.
// この記事で使用されているバージョン: - Visual Studio (対) コード: バージョン 1.14.1 - Typescript: バージョン 2.4.1 |
これは簡単なヒント, 何をやっているか分からない問題がある場合がありますが、: 私の場合は :(D)
Node.js と TypeScript のインストール
TypeScript をインストールする方法の 1 つは、Node.js のパッケージ マネージャーです。 (故宮博物院 – ノードのパッケージ マネージャー), しかし、それを使用するには, まず必要があります。 インストール、 Node.js.
ノードをインストールした後, ターミナルを開いてください。 (コマンド) 次のコマンドを実行 TypeScript をインストールします。:
故宮博物院のインストール -g typescript |
Windows ターミナル (または Linux), インストールされているバージョンを確認することによって、TypeScript のテストの実行を行う. コマンド “TSC” 頭字語は、TypeScript コンパイラ.
TSC -v |
問題
問題コマンドは、 “TSC” Windows ターミナルで正常に機能してください。, 統合されたターミナルではなく Visual Studio のコード中だが、 (対コード), 次のエラーを表示します。:
「tsc ' 認識されません。 として 内部または外部コマンド,操作可能なプログラムまたはバッチ ファイル ファイル. |
さらに, コマンドを実行したくなかった “TSC” たびに私はファイルをコンパイルしたいです。 “.TS” (TypeScript への拡張). だから, どのように保存する自動ビルドを行う (CTRL キーを押しながら S)? 私たちがさらに表示されます。.
アウトロの誤り
これらの問題を解決しようとしています。, 使用すると言う記事を発見した、 compileOnSave, しかし、これは Visual Studio でのみサポート 2015 TypeScript の > = 1.8.4 アトム typescript プラグイン. IE, 使用しても意味がないです。 compileOnSave で “json tsconfig。” Visual Studio コード, 次のコードは動作しません:
{ "compileOnSave": 場合は true。, "compilerOptions": { "noImplicitAny" : 場合は true。 } } |
ソリューション
VS で TSC 統合ターミナル コード
最初に、我々 はの問題を解決します。 TSC Visual Studio の統合端子のコードで認識されません。 (対コード).
いくつか 投稿 示唆している PATH 環境変数に tsc や npm のパスを挿入, この問題を解決する簡単な方法をやっていたが、 インストール、 “Visual Studio の typescript“, 対コードに互換性があります。.
今はい, インストール後, 開いている Visual Studio 統合ターミナル コード, 入力します。:
// Visual Studio のショートカット キー統合ターミナル コード: CTRL キー+` // メニューを使用して、Visual Studio のコードで端末を開くまたは: ビュー > 統合されたターミナル |
チェックしてみてください、 TypeScript バージョン 統合されたターミナル コード対直接 (Windows ターミナルではなく), おそらく作業になりますと:
TSC -v |
ファイルの保存時の自動コンパイル .TS
ターミナルのコード スクリプト ディレクトリに対をスタンドします。 (.TS), 例えば、:
CD C:\wamp64wwwts |
ファイルを作成します。 json tsconfig。 ターミナルとコードを入力して:
TSC --init |
注意してくださいファイル “json tsconfig。” 作成されます。 “(C):\wamp64wwwts” (現在のディレクトリ).
開いている、 json tsconfig。 オプションを有効にして “ソースマップ”: 場合は true。, 変更を保存し、, このように:
"compilerOptions": { /* 基本的なオプション */ "target": "es5", /* ECMAScript ターゲット バージョンを指定します。: ' バッファロー ' (デフォルト), 「ES5 ', ' ES2015 ', ' ES2016 ', ' ES2017 ', または 'ESNEXT'. */ "module": "commonjs", /* モジュール コードの生成を指定します。: ' commonjs ', 「amd」, ' システム ', ' umd ', ' es2015 ', または 'ESNext'. */ // "lib": [], /* コンパイルに含まれるライブラリ ファイルを指定します。: */ // "allowJs": 場合は true。, /* コンパイルする javascript ファイルを許可します。. */ // "checkJs": 場合は true。, /* .Js ファイルでエラーを報告. */ // "jsx": "preserve", /* JSX コード生成を指定します。: ' preserve', ' 反応するネイティブ ', または '反応'. */ // "declaration": 場合は true。, /* 対応する生成します '. d.ts のファイル. */ "sourceMap": 場合は true。, /* 対応する '.map' ファイルを生成します. */ // "outFile": "./", /* 連結し、1 つのファイルに出力. */ // "outDir": "./", /* ディレクトリにリダイレクト出力構造. */ // "rootDir": "./", /* 入力ファイルのルート ディレクトリを指定します。. -OutDir と出力ディレクトリ構造を制御するために使用. */ ... 続けています。 ... |
準備ができて, アゴラ é só ir ターミナルは対コード e digitar o コマンドを行う:
TSC -w |
エステ コンジュント fica monitorando (ou vendo, だから “w” ・ デ ・時計) aplicação e qualquer alteração ない arquivos .TS, quando 一斉射撃, fará imediata compilação em .js.
それです!