TypeScript コードを JavaScript コードに変換する

1. オンライン エディターを使用して TypeScript を JavaScript コードに変換する
2. コード エディターを使用して TypeScript を JavaScript コードに変換する
3. TypeScript をグローバルにインストールして TypeScript を JavaScript コードに変換する

TypeScript ファイルを JavaScript ファイルに変換して、必要な場所で効果的に使用するには、いくつかの方法があります。 Web ブラウザーは、.ts または TypeScript ファイルの実行を許可しません。 したがって、TypeScript ファイルを通常の JavaScript ファイルに変換して、Web ブラウザーで実行することが不可欠です。

TypeScript は Web ブラウザーで使用する前に変換する必要がありますが、React.js や Angular などのフレームワークやライブラリでさえ、コードを開発する際にプレーンな JavaScript を使用するのではなく、TypeScript を使用することをプログラマーに奨励しています。

コードを記述する際にプレーンな JavaScript を使用するよりも TypeScript が推奨される主な理由は、TypeScript コードが JavaScript の静的型定義を追加することです。 TypeScript はまた、コードが正しく機能し、すべての Web ブラウザーおよびプラットフォームと互換性があることを検証し、複数のテーマにわたって保守可能であることを保証します。

drag.js と Angular を使用する場合、Webpack または別のバンドルを使用してバックグラウンドで TypeScript を JavaScript に変換するため、TypeScript を JavaScript に変換する必要はありません。 ただし、スタンドアロンの JavaScript のみを使用する場合は、TypeScript を JavaScript に変換する必要があり、いくつかの方法を使用して行うことができます。

主な方法を3つ紹介します。

オンライン エディターを使用して TypeScript を JavaScript コードに変換する

最初の最も簡単な方法は、TypeScript をオンラインで JavaScript コードに変換することです。 これは、TypeScript Web サイトまたはその他のオンライン エディターまたはオンライン ツールを使用して行うことができます。

TypeScript の Web サイトを使用する場合は、ツールの Playground Tool を使用するか、TypeScript Playground に直接移動します。 ここでの唯一の手順は、コードを指定されたエディターにコピー アンド ペーストすることであり、コードは直接 JavaScript に変換されます。

さらに、コードを実行して、想定どおりに動作するかどうかを確認することもできます。

コード エディターを使用して TypeScript を JavaScript コードに変換する

使用できる別の方法は、Microsoft Visual Studio Code のような優れたコード エディターを使用してから、TypeScript を JavaScript に変換するために使用できる拡張機能をインストールすることです。 たとえば、Compile Hero 拡張機能を使用して上記の機能を実現できます。

TypeScript をグローバルにインストールして TypeScript を JavaScript コードに変換する

3つ目の方法は、コンピューターと NodeJS に TypeScript をグローバルにインストールすることです。 npm または yarn と同様に、パッケージ マネージャー用にインストールされます。

その後、ターミナルを使用して TypeScript ユーティリティにアクセスし、コマンドを使用して TypeScript ファイルを JavaScript に変換できます。 さらに、このメソッドを使用して TypeScript ファイルの変更を監視することもできます。

さらに、このユーティリティは、TypeScript 構成ファイルを作成するコマンドを提供します。

yarn を使用して TypeScript をインストールするには、まず目的のフォルダーでコマンド ラインを開き、yarn global add typescript と入力して Enter を入力するか、npm パッケージ タイプ npm install -g typescript をインストールします。 をコマンド ラインで入力し、Enter キーを押します。 その後、TypeScript 構成ファイルを作成するために、コマンド ラインで tsc --init を使用して Enter を押すと、tsconfig.json が作成されます。

構成ファイルが作成されると、ルート レベルに存在します。 したがって、構成ファイルの設定はユーザーの好みに合わせて変更でき、TypeScript から JavaScript への変換は構成ファイルに基づいて行われます。

TypeScript を JavaScript に変換するには、TypeScript ファイルのあるフォルダーでターミナルを開き、tsc FileName.ts と入力します。 ここで、上記のコードに記載されている FileName は、JavaScript に変換される TypeScript ファイルのファイル名である必要があります。

上記コードを実行すると、TypeScriptファイルを変換した新しいJavaScriptファイルが同じフォルダに作成されます。