Create an Angular app
Applies to: Visual Studio Visual Studio for Mac Visual Studio Code
In this 5-10 minute introduction to the Visual Studio integrated development environment (IDE), you create and run a simple Angular frontend web application.
Make sure to install the following:
- Visual Studio 2022 Preview 2 or later. Go to the Visual Studio downloads page to install it for free.
- npm (https://www.npmjs.com/), which is included with Node.js
- Angular CLI (https://angular.io/cli) This can be the version of your choice
Create your app
In the Start window (choose File > Start Window to open), select Create a new project.
Search for Angular in the search bar at the top and then select Standalone TypeScript Angular Template.
Give your project and solution a name.
When you get to the Additional information window, be sure NOT to check the Add integration for Empty ASP.NET Web API Project option. This option adds files to your Angular template so that it can be hooked up with the ASP.NET Core project, if an ASP.NET Core project is added.
View the project properties
The default project settings allow you to build and debug the project. But, if you need to change settings, right-click the project in Solution Explorer, select Properties, and then go the Build or Debugging section.
launch.json stores the startup settings associated with the Start button in the Debug toolbar. Currently, launch.json must be located under the .vscode folder.
Build Your Project
Choose Build > Build Solution to build the project.
Note, the initial build may take a while, as the Angular CLI will run the npm install command.
Start Your Project
Press F5 or select the Start button at the top of the window, and you'll see a command prompt:
The Angular CLI running the ng start command
Check console output for messages, such as a message instructing you to update your version of Node.js.
Next, you should see the base Angular apps appear!
For ASP.NET Core integration: