Vytvoření aplikace Angular
V tomto 5-10minutovém úvodu do integrovaného vývojového prostředí (IDE) sady Visual Studio vytvoříte a spustíte jednoduchou front-endovou webovou aplikaci Angular.
Požadavky
Nezapomeňte nainstalovat následující:
- Visual Studio 2022 nebo novější Přejděte na stránku pro stažení sady Visual Studio a nainstalujte ji zdarma.
- npm (https://www.npmjs.com/), který je součástí Node.js
- Angular CLI (https://angular.io/cli) Toto může být verze podle vašeho výběru.
Vytvoření aplikace
V okně Start (otevření zvolte Okno Spustit soubor>) vyberte Vytvořit nový projekt.
Na panelu hledání v horní části vyhledejte Angular a pak vyberte Samostatný projekt Angular TypeScriptu.
Pojmenujte projekt a řešení.
Když se dostanete do okna Další informace, nezapomeňte nekontrolovat možnost Přidat integraci pro prázdný projekt webového rozhraní API ASP.NET. Tato možnost přidá soubory do šablony Angular, aby bylo možné je připojit k projektu ASP.NET Core, pokud se přidá projekt ASP.NET Core.
Zvolte Vytvořit a počkejte na vytvoření projektu v sadě Visual Studio.
Zobrazení vlastností projektu
Výchozí nastavení projektu umožňuje sestavit a ladit projekt. Pokud ale potřebujete změnit nastavení, klikněte pravým tlačítkem myši na projekt v Průzkumník řešení, vyberte Vlastnosti a pak přejděte do části Sestavení nebo ladění.
Poznámka:
launch.json ukládá nastavení spuštění přidružené k tlačítku Start na panelu nástrojů Ladění. V současné době musí být soubor launch.json umístěný ve složce .vscode.
Sestavení projektu
Zvolte Sestavit>řešení pro sestavení a sestavte projekt.
Všimněte si, že počáteční sestavení může chvíli trvat, protože Rozhraní příkazového řádku Angular spustí příkaz npm install.
Spuštění projektu
Stiskněte klávesu F5 nebo vyberte tlačítko Start v horní části okna a zobrazí se příkazový řádek:
Rozhraní příkazového řádku Angular se spuštěným příkazem ng start
Poznámka:
Zkontrolujte výstup konzoly pro zprávy, například zprávu s pokynem k aktualizaci verze Node.js.
V dalším kroku by se měly zobrazit základní aplikace Angular.
Další kroky
Integrace ASP.NET Core: