JavaScript コミュニティでは、TypeScript の認知度がますます高まっています。Azure Functions では Node.js が実行されていて、また TypeScript は JavaScript にコンパイルされるため、熱意のあるユーザーは既に TypeScript のコードを Azure Functions で実行することが可能でした。しかし、エクスペリエンスはシームレスではなく、Azure の既定のフォルダー構造などの要素によって、導入がやや面倒な状況でした。本日は、この状況を改善する一連のツール改善について発表します。Azure Functions ユーザーは、イベント ドリブンなアプリケーションを構築する際に、TypeScript を使用して簡単に開発できるようになりました。

ご存じない方のために説明すると、TypeScript は省略可能な静的型定義、クラス、およびインターフェイスを備えた、JavaScript のスーパーセットです。これらの機能により、開発の初期段階でバグを発見できるようになり、さらに堅牢なソフトウェア エンジニアリングが実現します。また、間接的な効果として、TypeScript は ECMAScript 2015 と互換性があるため、モダンな JavaScript 構文を活用できるようになります。

Azure Functions Core Tools と Azure Functions Extension for Visual Studio Code に対する今回の変更により、Azure Functions では既定の状態で TypeScript がサポートされるようになりました。この変更に含まれているのは、TypeScript 向けの一連のテンプレート、および型定義と npm スクリプトです。新たなエクスペリエンスの詳細についてお読みください。

TypeScript 向けテンプレート

Azure Functions Core Tools と Azure Functions Extension for VS Code の最新バージョンでは、関数を作成する際に TypeScript を使用するオプションがユーザーに提示されます。もう少し正確に述べると、ユーザーが新しい関数アプリを作成するときに、言語スタック選択に TypeScript を指定するオプションが表示されます。この操作によって、既定の package.json および .tsconfig ファイルの使用に対してオプトインしたことになり、アプリが TypeScript 互換になります。その後、関数を作成する際に、TypeScript 固有の各種関数テンプレートから選択できます。各テンプレートは、設定可能なトリガーを 1 つ表しています。また、JavaScript でサポートされているテンプレートごとに、TypeScript にも同等のテンプレートがあります。

この新しいフローの最も優れた点は、TypeScript の関数をトランスパイルして実行する際に、Functions に固有の操作を一切行う必要がないことです。このことが意味するのは、たとえば、ユーザーが F5 を押して Visual Studio Code のデバッグを開始した場合、必要なインストール タスクの実行、TypeScript コードのトランスパイル、Azure Functions ホストの起動が Code によって自動的に行われる、ということです。このローカル開発エクスペリエンスはクラス最高で、ユーザーが他のアプリのデバッグを VS Code 上で開始する場合の方法そのものです。

TypeScript 関数を実行する方法の詳細については、弊社のドキュメントを参照してください。

Azure Functions 向けの型定義

npm 上の @azure/functions パッケージには、Azure Functions 向けの型定義が含まれています。Azure Function オブジェクトがどのような形をしているか、考えたことはありませんか。あるいは、すべての JavaScript 関数に渡されるコンテキスト オブジェクトについてはどうでしょうか。このパッケージが役立ちます。TypeScript を最大限に活用するために、このパッケージをすべての .ts 関数にインポートしてください。JavaScript 純粋主義者の方にもメリットがあります。このパッケージをコードにインクルードすると、Intellisense エクスペリエンスがより豊かになります。詳細については、@azure/functions パッケージを参照してください。

npm スクリプト

TypeScript 関数アプリには既定で package.json ファイルが含まれ、その中にいくつかの単純な npm スクリプトがあります。これらのスクリプトを使用すると、特定の Azure Functions Core Tools コマンドを呼び出すことで、一般的な開発フローに Azure Functions を直接フィットさせることができます。たとえば、‘npm start’ を実行すると、‘func start’ が自動的に実行されます。つまり、関数アプリを作成した後、他の Node.js プロジェクトと区別して扱う必要がありません。

実際の例をご覧になるには、弊社のサンプル リポジトリを参照してください。

自分で試してみる

Azure Functions Core Tools または Azure Functions Extension for VS Code を使用すれば、Azure アカウントがなくても、ローカル コンピューターで Azure Function における TypeScript エクスペリエンスの改善をお試しいただけます。

次の手順

• VS Code で Azure Functions の使用を開始する。
• Azure Functions Core Tools によって、ご使用の CLI で Azure Functions の使用を開始する。
• TypeScript 関数アプリの例をチェックする。
• Azure Functions の JavaScript 開発者向けガイドで追加情報を確認する。
• Azure の無料アカウントをお持ちでない場合はサインアップして、サーバーレス アプリをクラウドにデプロイする。

これまでと同様に、弊社の GitHub や Twitter で、いつでもチームにフィードバックをお寄せください。コーディングをお楽しみください!