Tools für ASP.NET-Core Blazor

  • Artikel

Hinweis

Dies ist nicht die neueste Version dieses Artikels. Informationen zum aktuellen Release finden Sie in der .NET 8-Version dieses Artikels.

Wichtig

Diese Informationen beziehen sich auf ein Vorabversionsprodukt, das vor der kommerziellen Freigabe möglicherweise noch wesentlichen Änderungen unterliegt. Microsoft gibt keine Garantie, weder ausdrücklich noch impliziert, hinsichtlich der hier bereitgestellten Informationen.

Informationen zum aktuellen Release finden Sie in der .NET 8-Version dieses Artikels.

In diesem Artikel werden Tools zum Erstellen von Blazor-Apps auf verschiedenen Plattformen vorgestellt. Wählen Sie oben in diesem Artikel Ihre Plattform aus.

Verwenden Sie die folgende Anleitung, um eine Blazor-App unter Windows zu erstellen:

  • Installieren Sie die neueste Version von Visual Studio mit der Workload ASP.NET und Webentwicklung.

  • Erstellen Sie mit einer der verfügbaren Blazor-Vorlagen ein neues Projekt:

    • Blazor-Web-App: Hiermit wird eine Blazor-Web-App erstellt, die das interaktive serverseitige Rendering (interaktives SSR) und das interaktive clientseitige Rendering (interaktives CSR) unterstützt. Die Blazor-Web-App-Vorlage wird für die ersten Schritte mit Blazor empfohlen, um mehr über serverseitige und clientseitige Blazor-Features zu erfahren.
    • Eigenständige Blazor WebAssembly-App: Hiermit wird eine eigenständige Web-App des Clients erstellt, die als statische Website bereitgestellt werden kann.

Wählen Sie Weiter aus.

  • Installieren Sie die neueste Version von Visual Studio mit der Workload ASP.NET und Webentwicklung.

  • Erstellen eines neuen Projekts:

    • Wählen Sie für eine Blazor Server-Benutzeroberfläche die Vorlage Blazor Server App mit Demonstrationscode und Bootstrap oder die Vorlage Blazor Server App Empty ohne Demonstrationscode und Bootstrap. Wählen Sie Weiter aus.
    • Wählen Sie für eine eigenständige Blazor WebAssembly-App die Vorlage Blazor WebAssembly-App aus, die Demonstrationscode und Bootstrap enthält, oder die Vorlage Leere Blazor WebAssembly-App ohne Demonstrationscode und Bootstrap aus. Wählen Sie Weiter aus.

  • Installieren Sie die neueste Version von Visual Studio mit der Workload ASP.NET und Webentwicklung.

  • Erstellen eines neuen Projekts:

    • Wählen Sie für eine Blazor Server-Benutzeroberfläche die Blazor Server-App- Vorlage aus. Klicken Sie auf Weiter.
    • Wählen Sie für eine Blazor WebAssembly-Benutzeroberfläche die Blazor WebAssembly-App- Vorlage aus. Klicken Sie auf Weiter.
  • Geben Sie einen Projektnamen ein, und bestätigen Sie, dass der Speicherort richtig ist.

Hinweis

Grundbegriffe und Konzepte des Rendering, die in den folgenden Anleitungen verwendet werden, werden in den folgenden Abschnitten des Übersichtsartikels Grundlagen vorgestellt:

Detaillierte Anleitungen zu Rendermodi finden Sie im Artikel ASP.NET Core Blazor-Rendermodi.

  • Für eine Blazor Web-App Im Dialogfeld Zusätzliche Informationen:

    • Dropdownliste für interaktiven Rendermodus

      • Das interaktive serverseitige Rendering (interaktives SSR) ist standardmäßig mit der Option Server aktiviert.
      • Um lediglich die Interaktivität mit dem clientseitigen Rendering (CSR) zu aktivieren, wählen Sie die Option WebAssembly aus.
      • Um beide interaktive Renderingmodi zu aktivieren und die Möglichkeit zu erhalten, automatisch während der Ausführung zwischen diesen zu wechseln, wählen Sie die Option Automatisch (Server und WebAssembly) (automatisch) als Rendermodus aus.
      • Wenn die Interaktivität auf None festgelegt ist, verfügt die generierte App über keine Interaktivität. Die App ist nur für statisches serverseitiges Rendering konfiguriert.

      Der Rendermodus „Interaktiv Automatisch“ verwendet zunächst das interaktive SSR, während das App Bundle für .NET und die Runtime im Browser heruntergeladen werden. Nachdem die .NET WebAssembly-Runtime aktiviert wurde, wechselt der Rendermodus zum interaktiven WebAssembly-Rendering.

      Standardmäßig ermöglicht die Blazor-Web-App-Vorlage sowohl statisches als auch interaktives SSR innerhalb eines Projekts. Wenn Sie auch CSR aktivieren, enthält das Projekt ein zusätzliches Clientprojekt (.Client) für Ihre WebAssembly-basierten Komponenten. Die Buildausgabe des Clientprojekts wird im Browser heruntergeladen und auf dem Client ausgeführt. Alle Komponenten, die den Rendermodus „WebAssembly“ oder „Automatisch“ verwenden, müssen aus dem Clientprojekt erstellt werden.

      Weitere Informationen finden Sie unter ASP.NET CoreBlazor-Rendermodi.

    • Dropdownliste für Interaktivitätsspeicherort

      • Pro Seite/Komponente: Die Standardeinstellung richtet die Interaktivität pro Seite oder Komponente ein.
      • Global: Beim Auswählen dieser Option wird die Interaktivität global für die gesamte App eingerichtet.

      Der Interaktivitätsspeicherort kann nur festgelegt werden, wenn der Modus für interaktives Rendern nicht None lautet und die Authentifizierung nicht aktiviert ist.

    • Wenn Sie Beispielseiten und ein Layout basierend auf der Bootstrapformatierung einschließen möchten, aktivieren Sie das Kontrollkästchen Beispielseiten einschließen. Deaktivieren Sie diese Option für ein Projekt ohne Beispielseiten und Bootstrapformatierung.

    Weitere Informationen finden Sie unter ASP.NET CoreBlazor-Rendermodi.

  • Aktivieren Sie im Dialogfeld Zusätzliche Informationen das Kontrollkästchen Von ASP.NET Core gehostet für eine gehosteteBlazor WebAssembly-App.

  • Wählen Sie Erstellen aus.

  • Drücken Sie zur Ausführung der App STRG+F5 (Windows) oder ⌘+F5 (macOS).

Wenn eine gehostete Blazor WebAssemblyLösung in Visual Studio ausgeführt wird, ist das Startup-Projekt der Lösung das Server Projekt.

Weitere Informationen zum Festlegen des ASP.NET Core-HTTPS-Entwicklungszertifikats als vertrauenswürdig finden Sie unter Erzwingen von HTTPS in ASP.NET Core.

Wichtig

Wenn Sie eine gehostete Blazor WebAssembly-App ausführen, führen Sie sie über das Projekt Server der Projektmappe aus.

Wenn die App gestartet wird, wird nur die Properties/launchSettings.json-Datei im Server-Projekt verwendet.

Verwenden Sie die folgende Anleitung, um eine Blazor-App unter Linux oder macOS zu erstellen:

Verwenden Sie die .NET-CLI (Befehlszeilenschnittstelle), um Befehle in einer Befehlsshell auszuführen.

Installieren Sie die neueste Version des .NET Core SDK. Wenn Sie das SDK zuvor installiert haben, können Sie die installierte Version ermitteln, indem Sie den folgenden Befehl ausführen:

dotnet --version

Installieren Sie die neueste Version von Visual Studio Code für Ihre Plattform.

Installieren Sie das C# Dev Kit für Visual Studio Code. Weitere Informationen finden Sie unter Debuggen von ASP.NET Core Blazor-Apps.

Erstellen eines neuen Projekts:

  • Führen Sie für eine Blazor-Web-App mit standardmäßige aktiviertem serverseitigen Rendering den folgenden Befehl in einer Befehlsshell aus, die die blazor-Projektvorlage verwendet:

    dotnet new blazor -o BlazorApp

    Um nur das clientseitige Rendering zu aktivieren, verwenden Sie die Option -int|--interactivity, die Sie auf WebAssembly festlegen:

    dotnet new blazor -o BlazorApp -int WebAssembly

    Um das interaktive serverseitige Rendering und darauffolgend das clientseitige Rendering zu aktivieren, verwenden Sie die Option -int|--interactivity, die Sie auf Auto festlegen:

    dotnet new blazor -o BlazorApp -int Auto

    Wenn die Interaktivität durch Festlegen der Option -int|--interactivity auf None deaktiviert ist, verfügt die generierte App über keine Interaktivität. Die App ist nur für statisches serverseitiges Rendering konfiguriert:

    dotnet new blazor -o BlazorApp -int None

    Der Rendermodus „Interaktiv Automatisch“ verwendet zunächst das interaktive serverseitige Rendering (SSR), während das App Bundle für .NET und die Runtime im Browser heruntergeladen werden. Nachdem die .NET WebAssembly-Runtime aktiviert wurde, wechselt der Rendermodus zum interaktiven WebAssembly-Rendermodus.

    Standardmäßig ermöglicht die Blazor-Web-App-Vorlage sowohl statisches als auch interaktives serverseitiges Rendering innerhalb eines Projekts. Wenn Sie zusätzlich den Rendermodus „Interaktives WebAssembly“ aktivieren, enthält das Projekt ein weiteres Clientprojekt (.Client) für Ihre WebAssembly-basierten Komponenten. Die Buildausgabe des Clientprojekts wird im Browser heruntergeladen und auf dem Client ausgeführt. Alle Komponenten, die den Rendermodus „Interaktives WebAssembly“ oder „Interaktiv Automatisch“ verwenden, müssen aus dem Clientprojekt erstellt werden.

    Weitere Informationen finden Sie unter ASP.NET CoreBlazor-Rendermodi.

    Apps legen den Interaktivitätsspeicherort standardmäßig je nach Komponente oder Seite fest. Verwenden Sie die Option -ai|--all-interactive, um die Interaktivität in der gesamten App einzurichten:

    dotnet new blazor -o BlazorApp -ai

    Beim Auswählen dieser Option wird die Interaktivität für die gesamte App in der App-Komponente festgelegt, indem ein Rendermodus für die Komponenten HeadOutlet und Routes auf oberster Ebene angeben wird. Durch das Festlegen der Interaktivität für diese Komponenten wird die Interaktivität an alle untergeordneten Komponenten in der App weitergegeben.

    Der Interaktivitätsspeicherort kann nur festgelegt werden, wenn der Modus für interaktives Rendern (-int|--interactivity) nicht None lautet und die Authentifizierung nicht aktiviert ist.

    Verwenden Sie die Option -e|--empty, um eine App ohne Beispielseiten und Formatierungen zu erstellen:

    dotnet new blazor -o BlazorApp -e

  • Führen Sie für eine eigenständige Blazor WebAssembly-Instanz den folgenden Befehl in einer Befehlsshell aus, der die blazorwasm-Vorlage verwendet:

    dotnet new blazorwasm -o BlazorApp

    Verwenden Sie die Option -e|--empty, um eine eigenständige Blazor WebAssembly-App ohne Beispielseiten und Formatierungen zu erstellen:

    dotnet new blazorwasm -o BlazorApp -e

Erstellen eines neuen Projekts:

  • Führen Sie für eine Blazor Server-Benutzeroberfläche mit Demonstrationscode und Bootstrap den folgenden Befehl aus:

    dotnet new blazorserver -o BlazorApp

  • Erstellen Sie alternativ mithilfe der Projektvorlage blazorserver-empty eine Blazor Server-App ohne Demonstrationscode und Bootstrap:

    dotnet new blazorserver-empty -o BlazorApp

  • Führen Sie für eine eigenständige Blazor WebAssembly-App mit Demonstrationscode und Bootstrap den folgenden Befehl aus:

    dotnet new blazorwasm -o BlazorApp

  • Erstellen Sie alternativ mithilfe der Projektvorlage blazorwasm-empty eine eigenständige Blazor WebAssembly-App ohne Demonstrationscode und Bootstrap:

    dotnet new blazorwasm-empty -o BlazorApp

  • Fügen Sie für eine gehostete Blazor WebAssembly-Benutzeroberfläche mit Demonstrationscode und Bootstrap die Option „hosted“ (-ho/--hosted) an den Befehl an:

    dotnet new blazorwasm -o BlazorApp -ho

  • Erstellen Sie alternativ eine gehostete Blazor WebAssembly-App ohne Demonstrationscode und Bootstrap mithilfe der Vorlage blazorwasm-empty und der Option „hosted“:

    dotnet new blazorwasm-empty -o BlazorApp -ho

Erstellen eines neuen Projekts:

  • Führen Sie für Blazor WebAssembly den folgenden Befehl aus:

    dotnet new blazorwasm -o BlazorApp

  • Fügen Sie dem Befehl für ein gehostetes Blazor WebAssembly-Modell die Hostingoption (-ho oder --hosted) hinzu:

    dotnet new blazorwasm -o BlazorApp -ho

  • Führen Sie für Blazor Server den folgenden Befehl aus:

    dotnet new blazorserver -o BlazorApp

Öffnen Sie in Visual Studio Code den Ordner BlazorApp.

Wenn Visual Studio Code Sie auffordert, Ressourcen zum Erstellen und Debuggen des Projekts hinzuzufügen, wählen Sie Ja aus.

Wenn Visual Studio Code nicht automatisch das Hinzufügen von Build- und Debugressourcen (der Ordner .vscode mit launch.json- und tasks.json-Dateien) anbietet, wählen Sie Ansicht>Befehlspalette aus, und geben Sie „.NET“ in das Suchfeld ein. Wählen Sie in der Liste der Befehle den Befehl „.NET: Generate Assets for Build and Debug“ aus.

Hinweis

Weitere Informationen zur Konfiguration und Verwendung von Visual Studio Code finden Sie in der Visual Studio Code-Dokumentation.

Die Datei Properties/launchSettings.json des Projekts enthält die inspectUri-Eigenschaft für den Debugproxy für alle Profile im Abschnitt profiles der Datei:

"inspectUri": "{wsProtocol}://{url.hostname}:{url.port}/_framework/debug/ws-proxy?browser={browserInspectUri}",

Start- und Taskkonfiguration für gehostete Blazor WebAssembly-Projektmappen

Fügen Sie für gehostete Blazor WebAssemblyLösungenden .vscode Ordner mit den Dateien launch.json und tasks.json zum übergeordneten Ordner der Projektmappe hinzu, bei dem es sich um den Ordner handelt, der die typischen Projektordner Client, Server, und Shared enthält (oder verschieben Sie die Dateien in diesen übergeordneten Ordner). Aktualisieren Sie die Konfiguration in den Dateien launch.json und tasks.json, oder bestätigen Sie, dass diese eine gehostete Blazor WebAssembly-App im Projekt Server ausführen.

Wichtig

Wenn Sie eine gehostete Blazor WebAssembly-App ausführen, führen Sie sie über das Projekt Server der Projektmappe aus.

Wenn die App gestartet wird, wird nur die Properties/launchSettings.json-Datei im Server-Projekt verwendet.

Untersuchen Sie die Datei Properties/launchSettings.json, und bestimmen Sie die URL der App über die Eigenschaft applicationUrl. Abhängig von der Frameworkversion ist das URL-Protokoll entweder sicher (HTTPS) https://localhost:{PORT} oder unsicher (HTTP) http://localhost:{PORT}, wobei der Platzhalter {PORT} einem zugewiesenen Port entspricht. Notieren Sie sich die URL, um sie in der Datei launch.json zu verwenden.

In der Startkonfiguration der .vscode/launch.json-Datei:

  • Legen Sie das aktuelle Arbeitsverzeichnis (cwd) im Projektordner Server fest.
  • Geben Sie die URL der App mit der url-Eigenschaft an. Verwenden Sie den Wert, der zuvor in der Properties/launchSettings.json-Datei aufgezeichnet wurde.
"cwd": "${workspaceFolder}/{SERVER APP FOLDER}",
"url": "{URL}"

In der vorherigen Konfiguration:

  • Der Platzhalter {SERVER APP FOLDER} steht für den Ordner des Projekts Server , in der Regel Server.
  • Der {URL}-Platzhalter ist die URL der App, die in der Properties/launchSettings.json-Datei der App in der applicationUrl-Eigenschaft angegeben wird.

Wenn Sie Google Chrome gegenüber Microsoft Edge bevorzugen, aktualisieren Sie die Konfiguration, oder fügen Sie die zusätzliche Eigenschaft "browser": "chrome" hinzu.

Für die folgende Beispieldatei .vscode/launch.json gilt Folgendes:

  • Die Datei legt das aktuelle Arbeitsverzeichnis auf den Ordner Server fest.
  • Sie legt die URL für die App auf http://localhost:7268 fest.
  • Sie stellt den Standardbrowser von Microsoft Edge auf Google Chrome um.
"cwd": "${workspaceFolder}/Server",
"url": "http://localhost:7268",
"browser": "chrome"

Die vollständige .vscode/launch.json-Datei:

{
  "version": "0.2.0",
  "configurations": [
    {
      "type": "blazorwasm",
      "name": "Launch and Debug Blazor WebAssembly Application",
      "request": "launch",
      "cwd": "${workspaceFolder}/Server",
      "url": "http://localhost:7268",
      "browser": "chrome"
    }
  ]
}

Fügen Sie in .vscode/tasks.json ein build-Argument hinzu, das den Pfad zur Projektdatei der Server -App angibt.

"${workspaceFolder}/{SERVER APP FOLDER}/{PROJECT NAME}.csproj",

Für das obige Argument gilt Folgendes:

  • Der Platzhalter {SERVER APP FOLDER} steht für den Ordner des Server-Projekts, in der Regel Server.
  • Der Platzhalter {PROJECT NAME} steht für den Namen der App, der in der Regel auf dem Namen der Projektmappe basiert, gefolgt von .Server bei einer App, die unter Verwendung der Blazor WebAssembly-Projektvorlage generiert wurde.

Eine .vscode/tasks.json-Beispieldatei mit einem Server -Projekt namens BlazorHosted im Ordner Server der Projektmappe:

{
  "version": "2.0.0",
  "tasks": [
    {
      "label": "build",
      "command": "dotnet",
      "type": "process",
        "args": [
          "build",
          "${workspaceFolder}/Server/BlazorHosted.Server.csproj",
          "/property:GenerateFullPaths=true",
          "/consoleloggerparameters:NoSummary",
        ],
        "group": "build",
        "presentation": {
          "reveal": "silent"
        },
        "problemMatcher": "$msCompile"
    }
  ]
}

Drücken Sie zur Ausführung der App STRG+F5 (Windows) oder ⌘+F5 (macOS).

Hinweis

Derzeit wird nur das Debuggen im Browser unterstützt.

Sie können die Server -Back-End-App einer gehosteten Blazor WebAssembly-Lösung nicht automatisch während des Debuggens neu erstellen, z. B. durch Ausführen der App mit dotnet watch run.

.vscode/launch.json (launch-Konfiguration):

...
"cwd": "${workspaceFolder}/{SERVER APP FOLDER}",
...

In der obigen Konfiguration für das aktuelle Arbeitsverzeichnis (cwd) steht der Platzhalter {SERVER APP FOLDER} für den Ordner des Projekts Server , in der Regel „Server“.

Wenn Microsoft Edge verwendet wird und Google Chrome nicht auf dem System installiert ist, fügen Sie der Konfiguration die zusätzliche Eigenschaft "browser": "edge" hinzu.

Beispiel für einen Projektordner von Server, der Microsoft Edge statt den Standardbrowser Google Chrome als Browser für Debugausführungen verwendet:

...
"cwd": "${workspaceFolder}/Server",
"browser": "edge"
...

.vscode/tasks.json (Argumente des dotnet-Befehls):

...
"${workspaceFolder}/{SERVER APP FOLDER}/{PROJECT NAME}.csproj",
...

Für das obige Argument gilt Folgendes:

  • Der Platzhalter {SERVER APP FOLDER} steht für den Ordner des Projekts Server , in der Regel „Server“.
  • Der Platzhalter {PROJECT NAME} steht für den Namen der App, der in der Regel auf dem Namen der Projektmappe basiert, gefolgt von „.Server“ bei einer App, die unter Verwendung der Blazor-Projektvorlage generiert wurde.

Im folgenden Beispiel aus dem Tutorial für die Verwendung von SignalR mit einer Blazor WebAssembly-App werden der Projektordnername Server und der Projektname BlazorWebAssemblySignalRApp.Server verwendet:

...
"args": [
  "build",
    "${workspaceFolder}/Server/BlazorWebAssemblySignalRApp.Server.csproj",
    ...
],
...

Drücken Sie zur Ausführung der App STRG+F5 (Windows) oder ⌘+F5 (macOS).

Festlegen eines Entwicklungszertifikats als vertrauenswürdig

Weitere Informationen finden Sie unter Erzwingen von HTTPS in ASP.NET Core.

Visual Studio-Projektmappendatei (.sln)

Eine Projektmappe ist ein Container, der ein oder mehrere verwandte Codeprojekte gruppiert. Visual Studio verwendet eine Projektmappendatei (.sln), um Einstellungen für eine Projektmappe zu speichern. Lösungsdateien verwenden ein eindeutiges Format und sind nicht dazu geeignet, direkt bearbeitet zu werden.

Tools außerhalb von Visual Studio können mit Projektmappendateien interagieren:

  • Die .NET CLI kann Lösungsdateien erstellen und die Projekte in Lösungsdateien über den dotnet sln Befehl auflisten/ verändern. Andere .NET CLI-Befehle verwenden den Pfad der Lösungsdatei für verschiedene Veröffentlichungs-, Test- und Verpackungsbefehle.
  • Visual Studio Code kann den dotnet sln Befehl und andere .NET CLI-Befehle über sein integriertes Terminal ausführen, aber verwendet die Einstellungen in einer Lösungsdatei nicht direkt.

In der Blazor-Dokumentation wird die Lösung verwendet, um Apps zu beschreiben, die entweder aus der Blazor WebAssembly-Projektvorlage erstellt wurden, bei der die ASP.NET Core gehostet Option aktiviert ist, oder die aus einer Blazor Hybrid-Projektvorlage erstellt wurden. Apps, die aus diesen Projektvorlagen erstellt wurden, enthalten standardmäßig eine Lösungsdatei (.sln). Bei gehosteten Blazor WebAssembly-Apps, für die Entwickler*innen nicht Visual Studio verwenden, kann die Projektmappendatei ignoriert oder gelöscht werden, wenn sie nicht von .NET CLI-Befehlen verwendet wird.

Weitere Informationen finden Sie in den folgenden Ressourcen der Visual Studio-Dokumentation:

Verwenden von Visual Studio Code für die plattformübergreifende Blazor-Entwicklung

Visual Studio Code ist eine plattformübergreifende Open-Source-Entwicklungsumgebung (Integrated Development Environment, IDE), mit der Blazor-Apps entwickelt werden können. Verwenden Sie die .NET-CLI zum Erstellen einer neuen Blazor-App für die Entwicklung mit Visual Studio Code. Weitere Informationen finden Sie in der Linux- oder macOS-Version dieses Artikels.

Weitere Informationen zur Konfiguration und Verwendung von Visual Studio Code finden Sie in der Visual Studio Code-Dokumentation.

Blazor-Vorlagenoptionen

Das Blazor-Framework stellt Vorlagen zum Erstellen neuer Apps bereit. Mithilfe der Vorlagen können neue Blazor-Projekte und -Projektmappen erstellt werden, unabhängig von den Tools, die Sie für die Blazor-Entwicklung auswählen (Visual Studio, Visual Studio Code oder die .NET-CLI):

  • Projektvorlage für Blazor-Web-Apps: blazor
  • Projektvorlage für eigenständige Blazor WebAssembly-Apps: blazorwasm
  • Blazor Server-Projektvorlagen: blazorserver, blazorserver-empty
  • Blazor WebAssembly-Projektvorlagen: blazorwasm, blazorwasm-empty
  • Blazor Server-Projektvorlage: blazorserver
  • Blazor WebAssembly-Projektvorlage: blazorwasm

Weitere Informationen zu Blazor-Projektvorlagen finden Sie unter Blazor-Projektstruktur in ASP.NET Core.

Weitere Informationen zu Vorlagenoptionen finden Sie in den folgenden Ressourcen:

  • Artikel .NET-Standardvorlagen für dotnet new in der .NET Core-Dokumentation:
  • Übergeben der Hilfeoption (-h oder --help) an den CLI-Befehl dotnet new in einer Befehlsshell:
    • dotnet new blazor -h
    • dotnet new blazorwasm -h
  • Artikel .NET-Standardvorlagen für dotnet new in der .NET Core-Dokumentation:
    • blazorserver (enthält Optionen vom Typ blazorserver-empty)
    • blazorwasm (enthält Optionen vom Typ blazorwasm-empty)
  • Übergeben der Hilfeoption (-h oder --help) an den CLI-Befehl dotnet new in einer Befehlsshell:
    • dotnet new blazorserver -h
    • dotnet new blazorserver-empty -h
    • dotnet new blazorwasm -h
    • dotnet new blazorwasm-empty -h
  • Artikel .NET-Standardvorlagen für dotnet new in der .NET Core-Dokumentation:
  • Übergeben der Hilfeoption (-h oder --help) an den CLI-Befehl dotnet new in einer Befehlsshell:
    • dotnet new blazorserver -h
    • dotnet new blazorwasm -h

.NET WebAssembly-Buildtools

Die .NET-WebAssembly-Buildtools basieren auf Emscripten, einer Compilertoolkette für die Webplattform. Verwenden Sie eine der folgenden Methoden, um die Buildtools zu installieren:

  • Wählen Sie für die Workload ASP.NET und Webentwicklung im Visual Studio-Installer aus der Liste der optionalen Komponenten die Option .NET WebAssembly build tools (.NET-WebAssembly-Buildtools) aus.
  • Führen Sie dotnet workload install wasm-tools in einer Verwaltungsbefehlsshell aus.

Hinweis

.NET WebAssembly-Buildtools für .NET 6-Projekte

Die wasm-tools-Workload installiert die Buildtools für das aktuelle Release. Die aktuelle Version der Buildtools ist jedoch nicht mit vorhandenen Projekten kompatibel, die mit .NET 6 erstellt wurden. Projekte, die Buildtools verwenden, die sowohl .NET 6 als auch höhere Releases unterstützen müssen, müssen die Festlegung von Zielversionen verwenden.

Verwenden Sie die wasm-tools-net6-Workload für .NET 6-Projekte beim Entwickeln von Apps mit dem .NET 7 SDK. Um die wasm-tools-net6-Workload zu installieren, führen Sie den folgenden Befehl aus über eine Verwaltungsbefehlsshell aus:

dotnet workload install wasm-tools-net6

Weitere Informationen finden Sie in den folgenden Ressourcen:

Ahead-of-Time-Kompilierung (AOT)

Um Ahead-of-Time-Kompilierung (AOT)zu aktivieren, legen Sie <RunAOTCompilation> in der Projektdatei der App (.csproj) auf true fest:

<PropertyGroup>
  <RunAOTCompilation>true</RunAOTCompilation>
</PropertyGroup>

SIMD (Single Instruction Multiple Data)

Single Instruction Multiple Data (SIMD) für WebAssembly kann den Durchsatz vektorisierter Berechnungen verbessern, indem ein Vorgang mit mehreren Datenteilen parallel in einer einzigen Anweisung ausgeführt wird. SIMD ist standardmäßig aktiviert.

Um SIMD zu deaktivieren, z. B. beim Ziel von alten Browsern oder Browsern auf mobilen Geräten, die SIMD nicht unterstützen, legen Sie die <WasmEnableSIMD>-Eigenschaft in der Projektdatei der App (.csproj) auf false fest:

<PropertyGroup>
  <WasmEnableSIMD>false</WasmEnableSIMD>
</PropertyGroup>

Weitere Informationen finden Sie unter Konfigurieren und Hosten von .NET WebAssembly-Anwendungen: SIMD – Einzelanweisung, mehrere Daten und beachten Sie, dass die Anleitung nicht versioniert ist und für die neueste öffentliche Version gilt.

Single Instruction Multiple Data (SIMD) für WebAssembly kann den Durchsatz vektorisierter Berechnungen verbessern, indem ein Vorgang mit mehreren Datenteilen parallel in einer einzigen Anweisung ausgeführt wird. SIMD ist standardmäßig deaktiviert.

Um SIMD zu aktivieren, fügen Sie die auf true festgelegte <WasmEnableSIMD>-Eigenschaft in der Projektdatei der App (.csproj) hinzu:

<PropertyGroup>
  <WasmEnableSIMD>true</WasmEnableSIMD>
</PropertyGroup>

Weitere Informationen finden Sie unter Konfigurieren und Hosten von .NET WebAssembly-Anwendungen: SIMD – Einzelanweisung, mehrere Daten und beachten Sie, dass die Anleitung nicht versioniert ist und für die neueste öffentliche Version gilt.

Ausnahmebehandlung

Die Ausnahmebehandlung ist standardmäßig aktiviert. Fügen Sie zum Deaktivieren der Ausnahmebehandlung die <WasmEnableExceptionHandling>-Eigenschaft in der Projektdatei der App (.csproj) mit dem Wert false hinzu:

<PropertyGroup>
  <WasmEnableExceptionHandling>false</WasmEnableExceptionHandling>
</PropertyGroup>

Fügen Sie zum Aktivieren der WebAssembly-Ausnahmebehandlung die <WasmEnableExceptionHandling>-Eigenschaft in der Projektdatei der App (.csproj) mit dem Wert true hinzu:

<PropertyGroup>
  <WasmEnableExceptionHandling>true</WasmEnableExceptionHandling>
</PropertyGroup>

Zusätzliche Ressourcen