В данной статье мы рассмотрим подробную инструкцию по установке и настройке всех необходимых инструментов для создания нового проекта одностраничного (SPA — Single Page Application) web-приложения на базе платформы ASP.NET Core 2.0 с использованием фреймворка Angular 2.x в среде разработки Microsoft Visual Studio 2017.
Для начала необходимо убедиться, что установлены все необходимые компоненты для Visual Studio 2017
VS ASP.NET component
VS Node.js component
Заходим на сайт https://nodejs.org/, скачиваем и устанавливаем рекомендованную для большинства пользователей версию (LTS).
node.js
Создать папку проекта в проводнике.
Create Folder
Открываем консоль.
|
1 |
Win+R cmd |
Open cmd
Переходим в папку проекта.
|
1 2 |
d: cd vs/angular2 |
Go to folder
Создаем новое приложение ASP.NET Core with Angular 2.x.
|
1 |
dotnet new angular |
Create angular project
Восстанавливаем пакеты решения.
|
1 |
dotnet restore |
Restore .net libs
Восстанавливаем пакеты NPM. Этот процесс займет немного времени.
|
1 |
npm install |
Restore npm libs
После этого мы можем запустить созданное нами решение.
|
1 |
Angular2.csproj |
Start VS project
В результате откроется среда разработки Visual Studio 2017. В обозревателе решения мы видим все созданные файлы проекта.
VS solution
Запускаем проект для проверки его работы нажатием кнопки F5 (или нажатием кнопки Play) на локальном IIS Express сервере, и получаем следующий результат.
Hello, World Angular
Обратите внимание, что во время первого запуска приложения брандмауэр Windows может потребовать разрешения на работу в сетях. Предоставляем доступ.
permission
