コース: Blazor 基本講座

今すぐコースを受講しましょう

今すぐ登録して、23,200件以上登録されている、業界エキスパート指導のコースを受講しましょう。

Visual Studio CodeでBlazor WebAssemblyプロジェクトを編集する

Visual Studio CodeでBlazor WebAssemblyプロジェクトを編集する

コース: Blazor 基本講座

Visual Studio CodeでBlazor WebAssemblyプロジェクトを編集する

Visual Studio Code で Blazor WebAssembly の アプリケーション開発を開始する場合は、 まずコマンド操作で プロジェクトを作成します。 Visual Studio の上部 「ターミナル」から 「新しいターミナル」を起動します。 Visual Studio Code から 起動する必要はなく、 コマンドプロンプトや PowerShell など、 その他のコマンドラインツールを 利用しても構いません。 新しくプロジェクトを作成する場合は、 dotnet new blazor、 WebAssembly の略で wasm として、 出力するアウトプットの オプションを指定します。 -o で プロジェクトを出力したい フォルダーを指定します。 VsCode_Blazorwasm としましょう。 Enter をクリックすることで プロジェクトが作成されます。 このままターミナルから Visual Studio Code で このフォルダーを開く場合は、 code VsCode _Blazorwasm を選択します。 Windows のエクスプローラーから Visual Studio Code で開いても 同様のことはできます。 新しく Visual Studio Code が起動して、 このように VSCODE_BLAZORWASM の フォルダーが開かれていることが わかります。 この状態で編集したいファイルを選択し、 編集を始めることもできます。 今回は、 このままデバック実行をしてみましょう。 「ターミナル」を再び表示します。 実行する場合は、 dotnet run です。 デバックが実行され、 http のローカルホスト、 5157 ポートで アプリケーションが起動していることが わかります。 この URL を Ctrl ボタンを押しながら クリックすることで、 ブラウザで開くことができます。 ブラウザで開くとこのように、 Blazor WebAssembly の ページが表示されます。 このように、 Visual Studio Code で Blazor ウェブアプリケーションの プロジェクトを作成・実行する場合は、 コマンド操作で処理を行います。

目次