Реагировать на проект в Visual Studio 2017

Я хочу разработать приложение React в Visual Studio 2017 вместе с моим .NET-приложением (в том же решении).

Я использую TypeScript, поэтому мне нужен тип проекта, где я могу настроить сборку (я хочу, чтобы webpack проект и т.д., поэтому стандартной сборки Visual Studio TypeScript недостаточно).

Я установил node.js инструменты для разработчиков, но они позволяют мне создавать только те проекты node.js(которые запускаются a node.js при запуске) и не позволяйте мне настраивать процесс сборки.

Какой тип проекта лучше всего подходит для этого?

Ответы

Ответ 1

Недавно я это сделал и рекомендовал бы следующее:

  • Создайте проект "Пустой" в Visual Studio 2017.
  • Добавьте/создайте свой проект .NET, как обычно в Visual Studio.
  • Теперь создайте проект React. Я использовал create-react-app из Facebook для создания моего проекта React. У этого есть много действительно хороших встроенных функций, таких как Webpack, Jest (для тестирования), пряжа (для управления пакетами) и т.д. Однако эти данные "скрыты" от вас, поэтому сгенерированный проект выглядит намного проще. Если вам требуется сделать больше контроля над процессом сборки/тестирования, вы можете запустить команду create-react-app eject. Учтите, что это "односторонняя" операция, так как вы не можете вернуть файлы в create-react-app. Вам нужно будет установить node и yarn отдельно, если это не было очевидно.

  • Поскольку вы также хотите использовать TypeScript, вы должны использовать react-scripts-ts script следующим образом:

    create-react-app my-app --scripts-version=react-scripts-ts

    Microsoft имеет хорошую прогулку по здесь.

  • Сложная часть - получение созданного проекта React в Visual Studio. Я сделал это, установив модуль "Node.js development" из "установщика Visual Studio", который устанавливается с помощью Visual Studio. К сожалению, Microsoft, похоже, удалила пустой или пустой шаблон проекта TypeScript (см. здесь).

  • После установки инструментов Node.js вы можете создать проект на основе node в своем решении. Есть несколько вариантов в меню Файл → Создать → Проект... → Шаблоны → Другие языки → TypeScript левая меню. Я выбрал "Пустое Node.js веб-приложение".

  • После этого вам нужно будет скопировать файлы проекта React, созданные create-react-app, в проект Visual Studio. Мне легче создавать каталоги в Visual Studio, чтобы они были добавлены в файл проекта, затем скопировали файлы сгенерированных папок и, наконец, добавили их в папку проекта в Visual Studio.

  • В этот момент вы можете запускать скрипты в файле package.json, которые были добавлены create-react-app. Я предпочитаю запускать их в командной строке, но вы можете запускать их и в Visual Studio, используя "Проводник Runner Run" от Mads Kristensen.