Создание приложения React
В рамках этого краткого (на 5–10 минут) знакомства с возможностями интегрированной среды разработки (IDE) Visual Studio вы создадите и запустите простое внешнее веб-приложение React.
Необходимые компоненты
Обязательно установите следующие компоненты:
- Visual Studio 2022 или более поздней версии. Перейдите на страницу скачиваемых материалов Visual Studio, чтобы установить ее бесплатно.
- npm (https://www.npmjs.com/), который входит в состав Node.js
- npx (https://www.npmjs.com/package/npx).
Создание своего приложения
В окне запуска (чтобы открыть его, щелкните Файл>Окно запуска) выберите Создание нового проекта.
Найдите React в строке поиска в верхней части, а затем выберите автономный проект JavaScript React или автономный проект TypeScript React в соответствии с вашими предпочтениями.
Присвойте имена проекту и решению.
Если вы ранее выбрали автономный шаблон JavaScript React, когда откроется окно "Дополнительные сведения", НЕ устанавливайте флажок Добавить интеграцию для пустого проекта веб-API ASP.NET. Этот параметр добавляет файлы в шаблон React, чтобы позже его можно было связать с проектом ASP.NET Core, если проект ASP.NET Core был добавлен.
Нажмите кнопку "Создать", а затем дождитесь создания проекта в Visual Studio.
Обратите внимание, что создание проекта React занимает некоторое время, так как команда create-react-app, которая выполняется в это время, также выполняет команду установки npm.
Просмотр свойств проекта
Параметры проекта по умолчанию позволяют выполнить сборку и отладку проекта. Но если вам нужно изменить параметры, щелкните правой кнопкой мыши проект в Обозреватель решений, выберите Свойства, а затем перейдите в раздел Сборка или Отладка.
Примечание.
Файл launch.json хранит параметры запуска, связанные с кнопкой Запуск на панели инструментов отладки. В настоящее время файл launch.json должен находиться в папке .vscode.
Сборка проекта
Выберите Сборка>Собрать решение, чтобы собрать проект.
Запуск проекта
Нажмите клавишу F5 или нажмите кнопку "Пуск" в верхней части окна, и вы увидите командную строку, например:
- VITE версии 4.4.9 готов в 780 мс
Примечание.
Проверьте наличие в консоли сообщений, например сообщения с указанием обновить версию Node.js.
После этого откроется базовое приложение React!
Следующие шаги
Интеграция ASP.NET Core