Как настроить среду разработки SharePoint Framework

Вы можете создавать решения SharePoint Framework с помощью любого текстового редактора. Можно использовать среду macOS, Windows или Linux.

Примечание

Прежде чем выполнять действия, описанные в этой статье, настройте клиент Microsoft 365.

Эти действия также показаны в видео на канале SharePoint PnP в YouTube:

Важно!

В приведенных ниже инструкциях предполагается, что вы создаете решения для SharePoint Online с помощью последней версии SharePoint Framework. Если вы разрабатываете решения для SharePoint Server 2019 или SharePoint Server 2016, обратитесь к дополнительной документации по ссылкам из раздела См. также ниже.

Установите Node.js.

Установите последнюю версию Node.js LTS v14.

Это рекомендуемая в настоящее время версия Node.js для использования с SharePoint Framework (если ниже не указано иное).

Важно!

Среда Node.js часто обновляется и доступна на различных платформах, включая Windows, macOS и Linux. Точные ссылки для скачивания часто меняются, поэтому на этой странице они отсутствуют. Используйте указанные ниже сведения, чтобы определить, какой установщик скачать для вашей платформы.

Помните, что для Node.js всегда доступно два выпуска: LTS (долгосрочная поддержка) и текущая версия. SharePoint Framework поддерживается только для версий LTS. Дополнительные сведения о выпусках Node.js LTS см. на странице Node.js > Выпуски.

Совет

На веб-сайте Node.js всегда рекомендуется последняя версия установщика для выпуска LTS и для текущей версии. Если нужно скачать определенные версии Node.js, перейдите на страницу Node.js > Файлы для скачивания > Предыдущие выпуски.

  • Пользователи Windows могут использовать установщики *.msi для архитектуры x86 или x64, в зависимости от установленной версии Windows. Как правило, имеются только два файла *.msi с именами вида node-v{version-number}-x[86|64].msi.
  • Пользователям macOS подойдет установщик *.pkg, имя которого обычно имеет вид node-v{version-number}.pkg.

Можно проверить, установлена ли уже среда Node.js, а также определить установленную версию. Для этого выполните следующую команду:

node -v

SharePoint Framework версии 1.12.1 поддерживается в следующих версиях Node.js:

  • Node.js версии 10.13.0+ (Dubnium)
  • Node.js версии 12.13.0+ (Erbium)
  • Node.js v14.15.0+ (Fermium)

Внимание!

Если вы создаете компоненты SharePoint Framework для локальных развертываний SharePoint, ознакомьтесь с дополнительными страницами по ссылкам из раздела См. также для получения дополнительных сведений.

Установка редактора кода

Для создания веб-частей можно использовать любой редактор кода или интерфейс IDE, поддерживающий клиентскую разработку, например:

В указаниях и примерах в этой статье используется Visual Studio Code, но вы можете использовать любой редактор.

Установите необходимые компоненты набора инструментов

В наборе инструментов разработки и сборки решений SharePoint Framework используются различные популярные инструменты с открытым исходным кодом. Хотя большинство зависимостей включены в каждый проект, несколько глобальных зависимостей вам нужно будет установить на своей рабочей станции.

Совет

Вы можете установить все три приведенных ниже инструмента с помощью одной строки.

npm install gulp yo @microsoft/generator-sharepoint --global

Установка Gulp

Gulp — это средство выполнения задач на основе JavaScript, используемое для автоматизации повторяющихся задач. В наборе инструментов сборки SharePoint Framework задачи Gulp используются для сборки проектов и создания пакетов JavaScript, а полученные пакеты используются при развертывании решений.

Чтобы установить Gulp, введите следующую команду:

npm install gulp --global

Важно!

Если у вас Node.js v12+ или более высокого уровня, используйте Gulp v4+. Если у вас Node.js версии ниже 12, используйте Gulp v3. Дополнительные сведения см. в статье Заметки о выпуске SharePoint Framework версии 1.12.1 | Версии Gulp и Node.js версии 12+

Установка Yeoman

Yeoman помогает запускать новые проекты, предоставляя рекомендации и инструменты, которые позволят сохранить эффективность работы. Средства клиентской разработки SharePoint включают генератор Yeoman для создания веб-частей. Генератор предоставляет общие средства сборки, стандартный код и общий веб-сайт для тестирования веб-частей.

Чтобы установить Yeoman, введите следующую команду:

npm install yo --global

Установка генератора Yeoman для SharePoint

С помощью генератора веб-частей Yeoman для SharePoint можно быстро создать проект клиентского решения SharePoint с правильной цепочкой инструментов и структурой проекта.

Чтобы глобально установить генератор Yeoman для SharePoint Framework, введите такую команду:

npm install @microsoft/generator-sharepoint --global

Дополнительную информацию о генераторе Yeoman SharePoint см. в статье Формирование шаблонов проектов с помощью генератора Yeoman для SharePoint.

Установите современный веб-браузер

В качестве браузера для разработки необходимо использовать современный веб-браузер, например Microsoft Edge, Google Chrome или Firefox. Локальное рабочее место не поддерживает использование Internet Explorer 11.

Настройка доверия к самозаверяющему сертификату разработки

Локальный веб-сервер SharePoint Framework, используемый при тестировании пользовательских решений из среды разработки, по умолчанию использует HTTPS. Это реализуется с помощью самозаверяющего SSL-сертификата разработки. Самозаверяющие SSL-сертификаты не считаются надежными в вашей среде разработки. Сначала необходимо настроить доверие к сертификату в среде разработки.

Задача utility включена в каждый проект SharePoint Framework в форме задачи gulp. Вы можете сделать это сейчас или после создания первого проекта, как описано в руководстве Создание первой клиентской веб-части SharePoint (Hello World, часть 1).

После создания проекта с помощью генератора Yeoman для SharePoint Framework выполните следующую команду из корневой папки проекта.

gulp trust-dev-cert

Примечание

Предполагается, что вы установили все зависимости с помощью команды npm install после создания проекта. Этот шаг установит все задачи gulp в составе проекта.

Дополнительные средства

Вам также могут пригодиться следующие средства:

Дальнейшие действия

Теперь вы готовы создать свою первую клиентскую веб-часть!

SPFx и SharePoint Server (локальный)

Платформа SPFx доступна в SharePoint Online (SPO), SharePoint Server 2019 и SharePoint Server 2016. В инструкциях по настройке на этой странице предполагается, что вы создаете решения с помощью последней версии SPFx для SharePoint Online.

SharePoint Online включает все версии SPFx, в том числе все предыдущие и последнюю версии. Каждое решение SPFx содержит информацию, которая сообщает SPO, от какой среды выполнения SPFx оно зависит.

Если вы создаете решения для локального развертывания SharePoint Server, ознакомьтесь с разделом См. также для получения подробных сведений об определенных версиях SharePoint. Каждое локальное развертывание SharePoint поддерживает только определенную версию SPFx. Это может приводить к усложнению конфигураций среды разработки, если вы создаете разные решения для разных развертываний SharePoint.

В зависимости от сценария, вам могут потребоваться разные среды разработки. Для решения этих задач разработчики использовали следующие подходы:

  • виртуальные машины;

  • Docker;

  • Node Version Manager (NVM).

  • В SharePoint Server 2016 используется SharePoint Framework (SPFx) версии 1.1.

  • В SharePoint Server 2019 используется SharePoint Framework (SPFx) версии 1.4.1.

Устранение неполадок

Проверка версии глобально установленных пакетов

Чтобы получить список всех глобально установленных пакетов, выполните следующую команду:

npm list --global --depth=0️

Невозможно установить доверие к самозаверяющему сертификату разработки

Если при выполнении команды gulp trust-dev-cert не получается установить доверие к вашему самозаверяющему сертификату разработки, и при этом установлены правильные версии всех зависимостей, эту проблему обычно можно решить следующим образом: удалите все глобально установленные пакеты, удалите Node.js, перезагрузите компьютер и начните сначала.

В некоторых случаях выполнение команды gulp trust-dev-cert не дает нужного результата (установления доверия к самозаверяющему сертификату разработки на вашем компьютере). В таких редких случаях может потребоваться удалить скрытую папку, созданную в папке вашего профиля. Найдите и удалите папку /.gcb-serve-data, а затем снова попробуйте настроить доверие к самозаверяющему сертификату разработки.

Невозможно установить пакеты с помощью NPM — корпоративные прокси-серверы

Если ваша среда разработки защищена корпоративным прокси-сервером, вам необходимо настроить NPM для использования этого прокси-сервера. См. документацию npm-config по настройке среды разработки, защищенной корпоративным прокси-сервером, в частности настройки proxy & http-proxy. Дополнительная информация: Как настроить Node.js и Npm в среде, защищенной корпоративным веб-прокси

См. также