Установка gulp на windows: Установка node + gulp для Windows 10

Содержание

Установка node + gulp для Windows 10

Вы здесь:
Главная — JavaScript — JavaScript Основы — Установка node + gulp для Windows 10


Первым делом нужно установить платформу node js, чтобы разработчикам были доступны команды npm. Через команду npm, мы в дальнейшем установим и сам Gulp. В контексте работы с Gulp, мы будем использовать этот многофункциональный инструмент node js, как пакетный менеджер.


Установка node js


Скачиваем на сайте nodejs.org стабильную версию Node, рекомендованную для большинства пользователей. Система автоматически определит вашу операционную систему и выдаст подходящую ссылку на скачивание.



После скачивания запускаем установщик и делаем все, как на скриншотах.







Когда установщик закончит свою работу, откроется консоль и вы увидите следующее.




Как запустить консоль Windows 10 PowerShell


Работа на платформе node js ведется через npm команды, вводимые в консоль. У Windows 10 имеется встроенная консоль PowerShell, чтобы консоль запустилась, нужно зайти в папку проекта и зажав сочетание клавиш CTRL+SHIFT, выбрать из контекстного меню «Открыть окно PowerShell здесь».






Узнать версию node js


Для того чтобы убедится установился ли node js, проверяем его версию. Вводим в консоли команду node -v, если в ответ вы увидите название версии v.12.16.1, значит все в порядке. Делает такую же проверку и для npm. Команда npm -v должна вернуть номер версии 6.13.4. Все проверяемые номера версий актуальны на момент выхода этой статьи, у вас скорее всего будут уже другие номера версий.


Установка Gulp под Windows 10


Переходим на сайт gulpjs, запускаем в консоли команду npm install gulp-cli -g. Данная команда устанавливает Gulp глобально, то есть запускать его можно из любой папки на компьютере. Вроде как Gulp установился, но при проверки версии gulp -v, мы видим следующую картину. Что-то пошло не так.




Ошибка при установки Gulp


Система нам говорит (смотрим сообщение в консоли), что невозможно загрузить файл (gulp.ps1 cannot be loaded because running scripts is disabled) и предлагает почитать статью на сайте Microsoft о Политиках исполнения. Из статьи становится понятно, что политика выполнения PowerShell практикуется только на платформах Windows. Блокируется запуск скриптов с расширением .ps1. Что делать в таком случае? Меняем дефолтные настройки Windows через командную строку PowerShell.


  1. Запускаем PowerShell от имени администратора

  2. Проверяем текущие параметры для политики выполнения: Get-ExecutionPolicy -List

  3. Устанавливаем требуемый уровень (меняем политику выполнения) Set-ExecutionPolicy -Scope LocalMachine Unrestricted

  4. Проверяем версию Gulp, если после ввода gulp -v, вы видите CLI version: 2.2.0, значит установка прошла успешно.

Существенное дополнение


Если вы пишите код в редакторе VS Code, то вам вообще не нужна никакая консоль. У редактора имеется встроенный терминал, как раз для ввода различных команд. Больше не надо переключаться между отдельными вкладками, когда все в одном месте.


  • Создано 11.03.2020 10:16:42



  • Михаил Русаков

Предыдущая статья Следующая статья

Копирование материалов разрешается только с указанием автора (Михаил Русаков) и индексируемой прямой ссылкой на сайт (http://myrusakov.ru)!

Добавляйтесь ко мне в друзья ВКонтакте: http://vk.com/myrusakov.
Если Вы хотите дать оценку мне и моей работе, то напишите её в моей группе: http://vk.com/rusakovmy.

Если Вы не хотите пропустить новые материалы на сайте,
то Вы можете подписаться на обновления: Подписаться на обновления

Если у Вас остались какие-либо вопросы, либо у Вас есть желание высказаться по поводу этой статьи, то Вы можете оставить свой комментарий внизу страницы.

Порекомендуйте эту статью друзьям:

Если Вам понравился сайт, то разместите ссылку на него (у себя на сайте, на форуме, в контакте):


  1. Кнопка:

    <a href=»https://myrusakov.ru» target=»_blank»><img src=»https://myrusakov.ru/images/button.gif» alt=»Как создать свой сайт» /></a>

    Она выглядит вот так:


  2. Текстовая ссылка:
    <a href=»https://myrusakov.ru» target=»_blank»>Как создать свой сайт</a>

    Она выглядит вот так: Как создать свой сайт

  3. BB-код ссылки для форумов (например, можете поставить её в подписи):

    [URL=»https://myrusakov.ru»]Как создать свой сайт[/URL]

Установка gulp на windows 10

Я установил gulp

npm install --global gulp

и установите переменную envidoment:

 - variable: GULP_HOME
 - Value: C:\Users\myaccount\AppData\Roaming\npm\node_modules\gulp  (..\gulp is folder)

в переменных окружения
И попробуйте запустить «gulp». Затем я получаю сообщение в cmd:

C:\myaccount\workspace\todoparrot>gulp
[09:47:24] Local gulp not found in C:\myaccount\workspace\todoparrot

Как настроить gulp на работу?

node.js

windows

gulp

Поделиться

Источник


user2301515    

10 октября 2015 в 06:54

2 ответа

  • gulp-препроцесс и переменные окружения на Windows 10

    Я создаю JS-приложение на OSX и Windows 10, оба работают под управлением Node.js v4.2.x. Как часть моего процесса сборки я выполняю BUILD_TYPE={my-build-type} gulp build Который строит определенную конфигурацию моего приложения, используя gulp-preprocess . Соответствующая часть моего файла gulp…

  • gulp команда не работает на laravel Elixir на windows

    Я пытался запустить команду gulp в команде windows после установки node_modules в моей установке laravel, но она вернулась с этой ошибкой в моей командной строке windows :- ‘gulp’ не распознается как внутренняя или внешняя команда, действующая программа или batch file. Я пытался использовать…


17

Вы должны локально установить gulp в эту папку. Используйте следующую команду:

npm install gulp

если он не исправлен, попробуйте установить его глобально:

npm install gulp-cli -g

Поделиться


fsf    

11 ноября 2015 в 03:36


3

Я установил gulp глобально, а затем использовал команду link, чтобы связать текущий каталог с глобальной установкой. Я использовал команду —

npm ссылка gulp

Поделиться


cs123    

27 сентября 2016 в 00:56

Похожие вопросы:

Проблемы с установкой GULP на Windows 10 в качестве ограниченного пользователя

Я пытаюсь установить gulp на свою машину development Windows 10 Pro, и она не работает. Я установил node.js, и когда я использую свою учетную запись администратора, я могу запустить gulp. Однако,…

Установка gulp-imagemin на Windows создает более 10 000 файлов

Я установил gulp-imagemin на свой ноутбук Windows 7 с помощью npm install —save-dev gulp-imagemin и после длительного процесса в итоге получилась папка с более чем 10 000 файлами и некоторыми очень…

Ошибка запуска gulp на Windows 10

Я запускаю Windows 10 build 10576 (последняя версия) и получаю ошибку при запуске gulp из корневой папки моего проекта(или где-либо еще). Вот скриншот ошибки: http://puu.sh/l3mLf/522a4e6dbe.png…

gulp-препроцесс и переменные окружения на Windows 10

Я создаю JS-приложение на OSX и Windows 10, оба работают под управлением Node.js v4.2.x. Как часть моего процесса сборки я выполняю BUILD_TYPE={my-build-type} gulp build Который строит определенную…

gulp команда не работает на laravel Elixir на windows

Я пытался запустить команду gulp в команде windows после установки node_modules в моей установке laravel, но она вернулась с этой ошибкой в моей командной строке windows :- ‘gulp’ не распознается…

Не удается установить gulp на windows 10

Я занят изучением Laravel и в процессе пытаюсь установить gulp. Операционная система: Windows 10 В командной строке: npm -v дает: 2.15.2 узел -v дает: v4.4.5 Затем я перепробовал все способы,…

Установка WinPcap на Windows 10

я whant, чтобы установить утилита WinPcap на окно 10, но я получаю ошибку ————————— WinPcap 4.1.3 настройка ————————— эта версия Windows не поддерживается WinPcap…

Gulp задач выбрасывают ошибку на Win 10

У меня есть windows 10 Pro, выполняющий упражнение отсюда https://vk.com/video-160048630_456239048? list=b31c949319120bc599 Установили gulp, gulp-меньше, gulp-уведомить, gulp-сантехник. Я создал…

Запуск gulp и установка среды в Windows

Я использую Windows 10 Pro. Недавно я сменил Ubuntu на Windows 64-bit. В Ubuntu я запустил node.js приложение, установив переменную окружения и используя node.js пакет gulp . Теперь я не знаю, как…

установка Redmine на на windows 10 этому искусству

Привет я пытаюсь установить Redmine на на windows 10 ,я пробовал установить с Bitnami и это есть ошибка о установка камней любой один, дайте мне решение по установке Redmine на на windows 10. я…

Как установить Gulp.js в Windows Выполнение скриптов…

Привет, Вы узнаете про как установить gulp js в windows, Разберем основные ее виды и особенности использования. Еще будет много подробных примеров и описаний. Для того чтобы лучше понимать что такое
как установить gulp js в windows , настоятельно рекомендую прочитать все из категории Выполнение скриптов на стороне клиента JavaScript, jqvery, JS фреймворки (Frontend)

Шаг  1 – Установка  Node.js

 

Перейдите на сайте http://nodejs.org 

выберите вашу операционную систему

и версию Node.js

 

Шаг 2 –Установка  Gulp.js

Откройте командную строку — (запустите CMD),

а затем ввести ‘npm’ — если нет никакой ошибки вы установили Node.js правильно !

В противном случае убедитесь, что вы закрыли и снова открыли командную строку,

если она была открыта во время установки.

 Или попробуйте перезагрузить коспьютер.

Затем выполнете

 npm install -g gulp

 для установки Gulp.js

 

ксли выполнить gulp и не будет ошибок в коммандной строке- то вы установили правильно

Шаг  3- Настройте ваш проект  

Вам нужно изменить файлы согласно вашему проекту, package.json and gulpfile.js.

 

Возможные проблемы

1 . Об этом говорит сайт https://intellect.icu . Ошибка Cannot find module ‘internal/fs’ afer upgrading to node 7

очистите кеш глобальных модулей 

npm cache clean
если не поможет то вручную удалите содержимое папок

C:\Users[username]\AppData\Roaming\npm

C:\Users[username]\AppData\Roaming\npm-cache

 

запустите заново установку пакетов

npm install
и запустите проверку обновлений
npm outdated -g
если и это не поможет попробуйте изменить версию NodeJS напрмер с 7ой на 6ю или на 4ю версию
2.Ошибка gulp-notify: [Error in notifier] Error in plugin 'gulp-notify' not found: notify-send
или отключите уведомления в файле gulpfile.js
process.env.DISABLE_NOTIFIER = true;
или переустанове модуль уведомлений

npm install -g gulp-notify
и
 npm install --save-dev gulp-notif
 


 
   Я что-то не договорил про как установить gulp js в  windows, тогда сделай замечание в комментариях Надеюсь, что теперь ты понял что такое как установить gulp js в  windows
          и для чего все это нужно, а если не понял, или есть замечания, 
            то нестесняся пиши или спрашивай в комментариях, с удовольствием отвечу.  Для того чтобы глубже понять настоятельно рекомендую изучить всю информацию из категории
              Выполнение скриптов на стороне клиента JavaScript, jqvery, JS фреймворки (Frontend)  

          
Установка Gulp

                
Давайте будем разбираться, как можно установить систему Gulp для вашего веб-проекта, который вы в данный момент разрабатываете. 
В этом нам поможет официальный сайт:
https://gulpjs.com
И на первом экране вы можете видеть, собственно, всю инструкцию по установке. По сути, это 3 строки, которые нужно будет ввести в командную строку. 
В первую очередь нужно понимать, что система Gulp требует того, чтобы на вашем компьютере был установлен менеджер пакетов npm. 
Открываем командную строку и выполняем следующую команду:
npm install gulp-cli -g
Это команда глобально установит в нашу операционную систему gulp для командной строки и после этого в командной строке должна стать доступной команда gulp.
Проверить, что у вас все работает, можно набрав:
gulp -v
и должна отобразиться текущая версия установленной gulp-cli.
Большинство команд, которые будут выполняться в системе Gulp, они выполняются через командную строку. Т.е. независимо от того, в каком проекте вы будете работать, важно установить эту систему глобально. 
Но, после глобальной установки системы Gulp, нужно понимать, что для каждого проекта будут свои настройки и задания для Gulp. 
Если мы создаем какую-то папку для нового проекта, мы должны установить для этого проекта систему Gulp. 
Переходим в папку нашего проекта с помощью команды cd путь_до_папки_проекта.
И нам нужно установить в эту папку уже локальную версию системы Gulp т.е. само ядро, к которой будут присоединятся модули и будет формироваться какой-то проект.
Выполняем команду:
npm install gulp -D
После этого у нас появляется папка node_modules, в которой располагаются все пакеты, которые нужны для работы Gulp.
И теперь для того, чтобы завершить процесс установки нам нужно или вручную создать файл gulpfile.js в корневой директории проекта или выполнить команду:
npx -p touch nodetouch gulpfile.js
Это основной настроечный файл, в котором пишутся команды, которые будет выполнять Gulp. Именно с ним мы будем работать в следующих уроках. 
По сути это весь процесс установки. Для каждого нового проекта будет создаваться такая структура папок. 
Давайте пока завершим с процессом установки и будем далее знакомиться с этой системой.
16. Установка NPM и модулей Gulp Основы Web-дизайна. Фронтэнд
16. Установка NPM и модулей Gulp
 (В инструкциях, связанных с Gulp, подразумевается, что вы пользуетесь Windows 7+)
В первую очередь, чтобы Gulp работал, нужно установить менеджер пакетов NPM. Он входит в состав node.js. Поэтому идём на сайт node.js и скачиваем установщик: nodejs.org. Рекомендую ставить LTS — версию. На данный момент последняя LTS версия — 8.11.1. Ее мы скачиваем и устанавливаем, как обычное приложение. Самое главное на этапе выбора модулей установить флажок рядом с NPM. Обычно он уже установлен, но лучше проверить.
Следующим этапом нужно запустить командную строку и установить Gulp глобально
Здесь и далее выделенный курсивом текст будет означать, то что его нужно прописать в командной строке.
npm install gulp -g
Отлично, когда Gulp установлен глобально, нужно установить его в папку с проектом. Для этого переходим в нашу папку (разумеется в командной строке):
cd путь/до/папки/с/проектом
Путь можно скопировать из Проводника. Теперь нужно инициализировать проект:
npm init
Заполняем сведения о проекте (на английском языке, иначе выдаст ошибку. В имени не допускаются пробелы и заглавные буквы), которые в последствии запишутся в файл package.json в директории проекта
1. Имя
2. Описание (можно оставить пустым)
3. Номер версии (можно оставить пустым)
4. Входная точка (можно оставить пустым)
5. Репозиторий на GitHub (можно оставить пустым)
6. Лицензия (можно оставить пустым).
Теперь нужно создать файл gulpfile.js в директории проекта.
Следующим шагом установим Gulp локально в проект:
npm install gulp —save—dev
Последнее, что нужно сделать перед настройкой gulpfile.js, это установить необходимые плагины:
 ©                            Даниил Голубев,
 
книга «Основы Web-дизайна. Фронтэнд».
Как настроить среду разработки SharePoint Framework

 
  • 
     
    • 
  • Чтение занимает 6 мин
    • 
  • 
    • 
В этой статье

Вы можете создавать решения SharePoint Framework с помощью любого текстового редактора.You can use any text editor to build SharePoint Framework solutions. Можно использовать среду macOS, Windows или Linux.You can use a macOS, Windows, or Linux environment as well.
Эти действия также показаны в видео на канале SharePoint PnP в YouTube:You can also follow these steps by watching this video on the SharePoint PnP YouTube Channel:
Важно!
В приведенных ниже инструкциях предполагается, что вы создаете решения для SharePoint Online с помощью последней версии SharePoint Framework.The following steps assume you’re building solutions for SharePoint Online using the latest version of the SharePoint Framework. Если вы разрабатываете решения для SharePoint Server 2019 или SharePoint Server 2016, обратитесь к дополнительной документации по ссылкам из раздела См. также ниже.If you’re building solutions for SharePoint Server 2019 or SharePoint Server 2016, refer to the additional documentation referenced in the See also section below.
Установите Node.js.Install Node.js
Установите последнюю версию Node.js LTS v14.Install the latest version of Node.js LTS v14.
Это рекомендуемая в настоящее время версия Node.js для использования с SharePoint Framework (если ниже не указано иное).This version is the currently recommended version of Node.js to use with the SharePoint Framework (unless otherwise specified below).
Важно!
Среда Node.js часто обновляется и доступна на различных платформах, включая Windows, macOS и Linux.Node.js is frequently updated and available on multiple platforms including macOS, Windows, and Linux. Точные ссылки для скачивания часто меняются, поэтому на этой странице они отсутствуют.Because the exact download links change frequently, they aren’t linked to from this page. Используйте указанные ниже сведения, чтобы определить, какой установщик скачать для вашей платформы.Instead, use the details below to determine which installer to download for your platform.
Помните, что для Node.js всегда доступно два выпуска: LTS (долгосрочная поддержка) и текущая версия.Be aware that Node.js maintains two different releases at all times: LTS & Current version. SharePoint Framework поддерживается только для версий LTS.The SharePoint Framework is only supported on LTS versions. Дополнительные сведения о выпусках Node.js LTS см. на странице Node.js > Выпуски.For more information about Node.js’s Long Term Support (LTS) releases, see: Node.js > Releases.
Совет
На веб-сайте Node.js всегда рекомендуется последняя версия установщика для выпуска LTS и для текущей версии.The Node.js website always recommends the latest installer for both the LTS & Current releases. Если нужно скачать определенные версии Node.js, перейдите на страницу Node.js > Файлы для скачивания > Предыдущие выпуски.To download specific versions of Node.js versions, use the Node.js > Downloads > Previous Releases page.
  • Пользователи Windows могут использовать установщики *.msi для архитектуры x86 или x64, в зависимости от установленной версии Windows.Windows users can use the *.msi installers for x86 or x64 depending on your Windows installation. Как правило, имеются только два файла *.msi с именами вида node-v{version-number}-x[86|64].msi.There are usually only two available *.msi files with names similar to node-v{version-number}-x[86|64].msi.
  • Пользователям macOS подойдет установщик *.pkg, имя которого обычно имеет вид node-v{version-number}.pkg.macOS users can use the *.pkg installer that’s usually is named node-v{version-number}.pkg.
Можно проверить, установлена ли уже среда Node.js, а также определить установленную версию. Для этого выполните следующую команду:You can check if you already have Node.js already installed, including installed version, by running the following command:
node -v

SharePoint Framework версии 1.12.1 поддерживается в следующих версиях Node.js:The SharePoint Framework v1.12.1 is supported on the following Node.js versions:
  • Node.js версии 10.13.0+ (Dubnium)Node.js v10.13.0+ (Dubnium)
  • Node.js версии 12.13.0+ (Erbium)Node.js v12.13.0+ (Erbium)
  • Node.js v14.15.0+ (Fermium)Node.js v14.15.0+ (Fermium)
Внимание!
Если вы создаете компоненты SharePoint Framework для локальных развертываний SharePoint, ознакомьтесь с дополнительными страницами по ссылкам из раздела См. также для получения дополнительных сведений.If you’re building SharePoint Framework components for SharePoint on-prem deployments, refer to the additional pages listed in the See also section for more information.
Установка редактора кодаInstall a code editor
Для создания веб-частей можно использовать любой редактор кода или интерфейс IDE, поддерживающий клиентскую разработку, например:You can use any code editor or IDE that supports client-side development to build your web part, such as:
В указаниях и примерах в этой статье используется Visual Studio Code, но вы можете использовать любой редактор.The steps and examples in this documentation use Visual Studio Code, but you can use any editor of your choice.
В наборе инструментов разработки и сборки решений SharePoint Framework используются различные популярные инструменты с открытым исходным кодом.The SharePoint Framework development and build toolchain leverages various popular open-source tools. Хотя большинство зависимостей включены в каждый проект, несколько глобальных зависимостей вам нужно будет установить на своей рабочей станции.While most dependencies are included in each project, you need to install a few dependencies globally on your workstation.
Совет
Вы можете установить все три приведенных ниже инструмента с помощью одной строки.You can install all three of the following tools in a single line:
npm install gulp yo @microsoft/generator-sharepoint --global

Установка GulpInstall Gulp
Gulp — это средство выполнения задач на основе JavaScript, используемое для автоматизации повторяющихся задач.Gulp is a JavaScript-based task runner used to automate repetitive tasks. В наборе инструментов сборки SharePoint Framework задачи Gulp используются для сборки проектов и создания пакетов JavaScript, а полученные пакеты используются при развертывании решений.The SharePoint Framework build toolchain uses Gulp tasks to build projects, create JavaScript bundles, and the resulting packages used to deploy solutions.
Чтобы установить Gulp, введите следующую команду:Enter the following command to install Gulp:
npm install gulp --global

Установка YeomanInstall Yeoman
Yeoman помогает запускать новые проекты, предоставляя рекомендации и инструменты, которые позволят сохранить эффективность работы.Yeoman helps you kick-start new projects, and prescribes best practices and tools to help you stay productive. Средства клиентской разработки SharePoint включают генератор Yeoman для создания веб-частей.SharePoint client-side development tools include a Yeoman generator for creating new web parts. Генератор предоставляет общие средства сборки, стандартный код и общий веб-сайт для тестирования веб-частей.The generator provides common build tools, common boilerplate code, and a common playground website to host web parts for testing.
Чтобы установить Yeoman, введите следующую команду:Enter the following command to install Yeoman:
npm install yo --global

Установка генератора Yeoman для SharePointInstall Yeoman SharePoint generator
С помощью генератора веб-частей Yeoman для SharePoint можно быстро создать проект клиентского решения SharePoint с правильной цепочкой инструментов и структурой проекта.The Yeoman SharePoint web part generator helps you quickly create a SharePoint client-side solution project with the right toolchain and project structure.
Чтобы глобально установить генератор Yeoman для SharePoint Framework, введите такую команду:To install the SharePoint Framework Yeoman generator globally, enter the following command:
npm install @microsoft/generator-sharepoint --global

Дополнительную информацию о генераторе Yeoman SharePoint см. в статье Формирование шаблонов проектов с помощью генератора Yeoman для SharePoint.For more information about the Yeoman SharePoint generator, see Scaffold projects by using Yeoman SharePoint generator.
Установите современный веб-браузерInstall a modern web browser
В качестве браузера для разработки необходимо использовать современный веб-браузер, например Microsoft Edge, Google Chrome или Firefox.You should be using a modern web browser like Microsoft Edge, Google Chrome, or Firefox as the development browser. Локальное рабочее место не поддерживает использование Internet Explorer 11.Local workbench doesn’t support usage of Internet Explorer 11.
Настройка доверия к самозаверяющему сертификату разработкиTrusting the self-signed developer certificate
Локальный веб-сервер SharePoint Framework, используемый при тестировании пользовательских решений из среды разработки, по умолчанию использует HTTPS.The SharePoint Framework’s local webserver, used when testing your custom solutions from your development environment, uses HTTPS by default. Это реализуется с помощью самозаверяющего SSL-сертификата разработки.This is implemented using a development self-signed SSL certificate. Самозаверяющие SSL-сертификаты не считаются надежными в вашей среде разработки.Self-signed SSL certificates are not trusted by your developer environment. Сначала необходимо настроить доверие к сертификату в среде разработки.You must first configure your development environment to trust the certificate.
Задача utility включена в каждый проект SharePoint Framework в форме задачи gulp.A utility task is included in every SharePoint Framework project in the form of a gulp task. Вы можете сделать это сейчас или после создания первого проекта, как описано в руководстве Создание первой клиентской веб-части SharePoint (Hello World, часть 1).You can elect to do this now, or wait until you create your first project as covered in the Build your first SharePoint client-side web part (Hello World part 1) tutorial.
После создания проекта с помощью генератора Yeoman для SharePoint Framework выполните следующую команду из корневой папки проекта.Once a project has been created with the Yeoman generator for the SharePoint Framework, execute the following command from within the root folder of the project.
gulp trust-dev-cert

Примечание
Предполагается, что вы установили все зависимости с помощью команды npm install после создания проекта.This assumes you have installed all dependencies with npm install after creating the project. Этот шаг установит все задачи gulp в составе проекта.This step will install all gulp tasks as part of a project.
Вам также могут пригодиться следующие средства:Following are some tools that might come in handy as well:
Дальнейшие действияNext steps
Теперь вы готовы создать свою первую клиентскую веб-часть!You’re now ready to build your first client-side web part!
SPFx и SharePoint Server (локальный)SPFx & SharePoint Server (on-prem)
Платформа SPFx доступна в SharePoint Online (SPO), SharePoint Server 2019 и SharePoint Server 2016.The SPFx is available on SharePoint Online (SPO), SharePoint Server 2019, & SharePoint Server 2016. В инструкциях по настройке на этой странице предполагается, что вы создаете решения с помощью последней версии SPFx для SharePoint Online.The configuration instructions on this page assume you’re creating solutions using the latest version of the SPFx for SharePoint Online.
SharePoint Online включает все версии SPFx, в том числе все предыдущие и последнюю версии.SharePoint Online contains all versions of the SPFx, including all previous and the latest version. Каждое решение SPFx содержит информацию, которая сообщает SPO, от какой среды выполнения SPFx оно зависит.Each SPFx solution contains information to tell SPO which SPFx runtime it depends.
Если вы создаете решения для локального развертывания SharePoint Server, ознакомьтесь с разделом См. также для получения подробных сведений об определенных версиях SharePoint.If you’re building solutions for a SharePoint Server on-prem deployment, review to the See also section for details on specific SharePoint versions. Каждое локальное развертывание SharePoint поддерживает только определенную версию SPFx.Each SharePoint on-prem only supports a specific version of SPFx. Это может приводить к усложнению конфигураций среды разработки, если вы создаете разные решения для разных развертываний SharePoint.This can introduce complicated development environment configurations if you’re creating different solutions for different SharePoint deployments.
В зависимости от сценария, вам могут потребоваться разные среды разработки.Depending on your scenario, you may need to maintain different development environments. Для решения этих задач разработчики использовали следующие подходы:Developers have used the following approaches to address these challenges:
  • виртуальные машины;virtual machines
  • Docker;Docker
  • Node Version Manager (NVM).Node Version Manager (NVM)
  • В SharePoint Server 2016 используется SharePoint Framework (SPFx) версии 1.1.SharePoint Server 2016 uses the SharePoint Framework (SPFx) v1.1.
  • В SharePoint Server 2019 используется SharePoint Framework (SPFx) версии 1.4.1.SharePoint Server 2019 uses the SharePoint Framework (SPFx) v1.4.1.
Устранение неполадокTroubleshooting
Проверка версии глобально установленных пакетовCheck the version of globally installed packages
Чтобы получить список всех глобально установленных пакетов, выполните следующую команду:To get a list of all globally installed packages, run the following command:
npm list --global --depth=0️

Невозможно установить доверие к самозаверяющему сертификату разработкиUnable to Trust the Self-signed Development Certificate
Если при выполнении команды gulp trust-dev-cert не получается установить доверие к вашему самозаверяющему сертификату разработки, и при этом установлены правильные версии всех зависимостей, эту проблему обычно можно решить следующим образом: удалите все глобально установленные пакеты, удалите Node.js, перезагрузите компьютер и начните сначала.If you’re having trouble trusting your self-signed certificate when you run gulp trust-dev-cert & you’ve verified that the correct versions of all dependencies are installed, one solution we usually see resolve the issue is to uninstall all globally installed packages, uninstall Node.js, reboot & start again.
В некоторых случаях выполнение команды gulp trust-dev-cert не дает нужного результата (установления доверия к самозаверяющему сертификату разработки на вашем компьютере).In some cases, executing the command gulp trust-dev-cert, doesn’t have the wanted effect of trusting the self-signed development certificate on your machine. В таких редких случаях может потребоваться удалить скрытую папку, созданную в папке вашего профиля.In rare cases such as these, you may need to delete a hidden folder that’s generated in your profile folder. Найдите и удалите папку /.gcb-serve-data, а затем снова попробуйте настроить доверие к самозаверяющему сертификату разработки.Locate & delete the folder /.gcb-serve-data and then try to trust the self-signed development certificate again.
Невозможно установить пакеты с помощью NPM — корпоративные прокси-серверыUnable to Install Packages with NPM — Corporate Proxies
Если ваша среда разработки защищена корпоративным прокси-сервером, вам необходимо настроить NPM для использования этого прокси-сервера.If your development environment is behind a corporate proxy, you need to configure NPM to use that proxy. См. документацию npm-config по настройке среды разработки, защищенной корпоративным прокси-сервером, в частности настройки proxy & http-proxy.Refer to the npm-config documents on how to configure your development environment behind a corporate proxy… specifically the proxy & http-proxy settings. Дополнительная информация: Как настроить Node.js и Npm в среде, защищенной корпоративным веб-проксиMore information: How to setup Node.js and Npm behind a corporate web proxy
См. такжеSee also
gulp sass ошибка установки | Все о Windows 10

 На чтение 6 мин.            Просмотров 92            Опубликовано 
У меня есть ошибка, которую бросает только тогда, когда я пытаюсь установить gulp-sass. Я попытался установить другие модули (например, gulp-livereload), и они работают нормально. Использование npm версии 6.0.0. Вот раздел package.json, который требует его:
Единственное, что вызывает ошибки, — это gulp-sass. Это ошибка:
Оказывается, это не проблема разрешения. Все, что мне нужно было сделать, это добавить флаг —unsafe-perm=true . Я полагаю, что это проблема с самим postinstaller gulp-sass, судя по этому сообщению github. Спасибо vishwa за то, что указали, что разрешение отклонено, я бы никогда не нашел этот пост без него. 😉
Пытаюсь установить сборку gulp себе на диск, клонировал из репозитория, запускаю npm install , и выдаёт ошибку:
«C:Program FilesSublime Text 3sublime_text.exe. — Unexpected token P»
Sublime Text стоит редактором по умолчанию. В пользовательской переменной EDITOR находится путь, который указан в тексте ошибки. Как это можно исправить, и почему нода ругается на путь?
Здраствуйте! Хотел описать проблему. При установке пакета gulp-sass вылезает ошибка.Установка выполняется через node.js командой npm i gulp-sass. Вот весь вывод после ввода команды. 
> [email protected] install C:UsersaganiDesktopGulp
ode_modules
ode-sass 
> node scripts/install.js
HTTP error 404 Not Found
Hint: If github.com is not accessible in your location 
try setting a proxy via HTTP_PROXY, e.g.
or configure npm proxy via
npm config set proxy example.com:8080
> [email protected] postinstall C:UsersaganiDesktopGulp
ode_modules
ode-sass 
> node scripts/build.js
Building: C:Program Files
odejs
ode.exe C:UsersaganiDesktopGulp
ode_modules
ode-gypin
ode-gyp.js rebuild —verbose —libsass_ext= —libsass_cflags= —libsass_ldflags= —libsass_library= 
gyp info it worked if it ends with ok 
gyp verb cli [ 
gyp verb cli ‘C:\Program Files\nodejs\node.exe’, 
gyp verb cli ‘C:\Users\agani\Desktop\Gulp\node_modules\node-gyp\bin\node-gyp.js’, 
gyp verb cli ‘rebuild’, 
gyp verb cli ‘—verbose’, 
gyp verb cli ‘—libsass_ext=’, 
gyp verb cli ‘—libsass_cflags=’, 
gyp verb cli ‘—libsass_ldflags=’, 
gyp verb cli ‘—libsass_library=’ 
gyp verb cli ] 
gyp info using [email protected] 
gyp info using [email protected] | win32 | x64 
gyp verb command rebuild [] 
gyp verb command clean [] 
gyp verb clean removing «build» directory 
gyp verb command configure [] 
gyp verb check python checking for Python executable «python2» in the PATH 
gyp verb `which` failed Error: not found: python2 
gyp verb `which` failed at getNotFoundError (C:UsersaganiDesktopGulp
ode_moduleswhichwhich.js:13:12) 
gyp verb `which` failed at F (C:UsersaganiDesktopGulp
ode_moduleswhichwhich.js:68:19) 
gyp verb `which` failed at E (C:UsersaganiDesktopGulp
ode_moduleswhichwhich.js:80:29) 
gyp verb `which` failed at C:UsersaganiDesktopGulp
ode_moduleswhichwhich.js:89:16 
gyp verb `which` failed at C:UsersaganiDesktopGulp
ode_modulesisexeindex.js:42:5 
gyp verb `which` failed at C:UsersaganiDesktopGulp
ode_modulesisexewindows.js:36:5 
gyp verb `which` failed at FSReqCallback.oncomplete (fs.js:166:21) 
gyp verb `which` failed python2 Error: not found: python2 
gyp verb `which` failed at getNotFoundError (C:UsersaganiDesktopGulp
ode_moduleswhichwhich.js:13:12) 
gyp verb `which` failed at F (C:UsersaganiDesktopGulp
ode_moduleswhichwhich.js:68:19) 
gyp verb `which` failed at E (C:UsersaganiDesktopGulp
ode_moduleswhichwhich.js:80:29) 
gyp verb `which` failed at C:UsersaganiDesktopGulp
ode_moduleswhichwhich.js:89:16 
gyp verb `which` failed at C:UsersaganiDesktopGulp
ode_modulesisexeindex.js:42:5 
gyp verb `which` failed at C:UsersaganiDesktopGulp
ode_modulesisexewindows.js:36:5 
gyp verb `which` failed at FSReqCallback.oncomplete (fs.js:166:21) gyp verb `which` failed stack: ‘Error: not found: python2
at getNotFoundError ‘ + 
gyp verb `which` failed ‘(C:\Users\agani\Desktop\Gulp\node_modules\which\which.js:13:12)
at F ‘ + 
gyp verb `which` failed ‘(C:\Users\agani\Desktop\Gulp\node_modules\which\which.js:68:19)
at E ‘ + 
gyp verb `which` failed ‘(C:\Users\agani\Desktop\Gulp\node_modules\which\which.js:80:29)
at ‘ + 
gyp verb `which` failed ‘C:\Users\agani\Desktop\Gulp\node_modules\which\which.js:89:16
at ‘ + 
gyp verb `which` failed ‘C:\Users\agani\Desktop\Gulp\node_modules\isexe\index.js:42:5
at ‘ + 
gyp verb `which` failed ‘C:\Users\agani\Desktop\Gulp\node_modules\isexe\windows.js:36:5
at ‘ + 
gyp verb `which` failed ‘FSReqCallback.oncomplete (fs.js:166:21)’, 
gyp verb `which` failed code: ‘ENOENT’ 
gyp verb `which` failed > 
gyp verb check python checking for Python executable «python» in the PATH 
gyp verb `which` succeeded python C:UsersaganiAppDataLocalProgramsPythonPython37-32python. 
gyp ERR! stack SyntaxError: invalid syntax 
gyp ERR! stack 
gyp ERR! stack at ChildProcess.exithandler (child_process.js:304:12) 
gyp ERR! stack at ChildProcess.emit (events.js:196:13) 
gyp ERR! stack at maybeClose (internal/child_process.js:1000:16) 
gyp ERR! stack at Socket. (internal/child_process.js:405:11) 
gyp ERR! stack at Socket.emit (events.js:196:13) 
gyp ERR! stack at Pipe. (net.js:586:12) 
gyp ERR! System Windows_NT 10.0.17763 
gyp ERR! command «C:\Program Files\nodejs\node.exe» «C:\Users\agani\Desktop\Gulp\node_modules\node-gyp\bin\node-gyp.js» «rebuild» «—verbose» «—libsass_ext=» «—libsass_cflags=» «—libsass_ldflags=» «—libsass_library=» 
gyp ERR! cwd C:UsersaganiDesktopGulp
ode_modules
ode-sass 
gyp ERR! node -v v12.0.0 
gyp ERR! node-gyp -v v3.8.0 
gyp ERR! not ok 
Build failed with error code: 1 
npm WARN [email protected] No repository field. 
npm WARN optional SKIPPING OPTIONAL DEPENDENCY: [email protected] (node_modulesfsevents): 
npm WARN notsup SKIPPING OPTIONAL DEPENDENCY: Unsupported platform for [email protected]: wanted (current: )
npm ERR! code ELIFECYCLE 
npm ERR! errno 1 
npm ERR! [email protected] postinstall: `node scripts/build.js` 
npm ERR! Exit status 1 
npm ERR! 
npm ERR! Failed at the [email protected] postinstall script. 
npm ERR! This is probably not a problem with npm. There is likely additional logging output above.
npm ERR! A complete log of this run can be found in: 
npm ERR! C:UsersaganiAppDataRoaming
pm-cache\_logs2019-04-24T15_57_27_492Z-debug.log 
P.S. 
Заметил что-то связаное с python: 
stack Error: Command failed: C:UsersaganiAppDataLocalProgramsPythonPython37-32python.EXE -c import sys; print «%s.%s.%s» % sys.version_info[:3]; 
И то что проблема не с node.js
  • Вопрос задан 24 апр.
  • 368 просмотров
On Windows 
Option 1 
Install all the required tools and configurations using Microsoft’s windows-build-tools using npm install —global —production windows-build-tools from an elevated PowerShell or CMD.exe (run as Administrator).
Option 2 
Install tools and configuration manually:
Install Visual C++ Build Environment: Visual Studio Build Tools (using «Visual C++ build tools» workload) or Visual Studio 2017 Community (using the «Desktop development with C++» workload)
Install Python 2.7 (v3.x.x is not supported), and run npm config set python python2.7 (or see below for further instructions on specifying the proper Python version and path.) 
Launch cmd, npm config set msvs_version 2017
а в логах говорится, что он нашел третий питон
 Как мне установить gulp в Windows 10? 
  Как установить Gulp в Windows 10 
  1.  Загрузите 64-битную версию  NPM .
  2.   Установите  в любом месте, по умолчанию: C: Program Files odejs.
  3.  На вашем компьютере перейдите в Панель управления -> Система -> Дополнительные настройки системы -> Переменные среды.
  4.  Выберите ПУТЬ и отредактируйте его.
 Нажмите, чтобы увидеть полный ответ
 Здесь, как мне установить gulp глобально в Windows?
  Установите Gulp.txt 
  1.  Установите nodejs. https://nodejs.org/en/
  2.  Проверьте установку npm (диспетчера пакетов узлов) через командную строку: $ npm.
  3.  Установить gulp: $ npm install gulp —global.
  4.  В соответствующей папке проекта создайте поток сборки ‘gulpfile.js’: //, который копирует MyNiceProgram.exe в другой.
  5.  Запустить gulp:
 Кроме того, как узнать, установлен ли gulp? js версию. Шаг 6 — В командной строке введите следующую команду, чтобы  установить Gulp .Добавление флага «-g» гарантирует глобальную доступность  Gulp  для любого проекта. Шаг 7. Чтобы  проверить , что  Gulp  был успешно установлен  , введите следующую команду, чтобы отобразить версию  Gulp .
 В связи с этим, как мне установить Gulp?
  Результат 
  1.  Проверить узел, npm и npx.
  2.  Установите утилиту командной строки gulp.
  3.  Создайте каталог проекта и перейдите в него.
  4.  Создайте файл package.json в каталоге проекта.
  5.  Установите пакет gulp в свой devDependencies.
  6.  Проверьте свои версии gulp.
  7.  Создайте файл gulpfile.
  8.  Протестируйте.
 Что такое команда сборки Gulp?
  залп . js — это система  build , что означает, что вы можете использовать ее для автоматизации общих задач при разработке веб-сайта. Это  построено  на Node. js, а исходный код  Gulp  и ваш файл  Gulp , в котором вы определяете задачи, написаны на JavaScript (или что-то вроде CoffeeScript, если хотите).
 gulp-install — npm 
 Автоматически устанавливать пакеты / зависимости npm, bower, tsd, typings, composer и pip, если соответствующие конфигурации находятся в потоке файла gulp соответственно
 Найден файл Запуск команды
  package.json   npm установить 
  bower.json   установка беседки 
  тыс.json   tsd переустановить - сохранить 
  typings.json   наборов установить 
  composer.json   композитор установить 
  requirements.txt   pip install -r requirements.txt 
 Он запустит команду в каталоге, в котором находит файл, поэтому, если у вас есть конфигурации, вложенные в более низкий каталог, чем ваш slushfile .js / gulpfile.js , это все равно будет работать.
  ПРИМЕЧАНИЕ  с  v1.0.0  gulp-install требует как минимум NodeJS v6.
 Основная цель 
 Используется в качестве шага установки при использовании  slush  в качестве замены Yeoman.
 Установка 
 Для глобального использования со слякотью 
 Установить  gulp-install  как зависимость:
 
 npm install --save gulp-install 
 
 Для местного применения с глотком 
 Установите  gulp-install  как зависимость разработки:
 
 npm install --save-dev gulp-install 
 
 Использование 
 В вашем slushfile 
.js :
 
 var install = require ("gulp-install"); 
 
 
 
 gulp.src (__ dirname + '/ templates / **') 
 
 .pipe (gulp.dest ('./')) 
 
 .pipe (install ()); 
 
 В вашем 
 gulpfile.js :
 
 var install = require ("gulp-install"); 
 
 
 
 gulp.src (['./ bower.json', './package.json']) 
 
 .pipe (install ()); 
 
 API 
 ввести ([параметры] [, обратный вызов]) 
 Параметр Тип Описание
 опции  Объект  Любой вариант
 обратный звонок  Функция  Вызывается после завершения установки (не при сбоях)
 Опции 
 Чтобы не запускать установку, используйте  --skip-install  в качестве параметра CLI при запуске  slush  или  gulp .
 вариантов. 
 <команда> 
  Тип:   Массив | Строка | Объект 
  По умолчанию:   null 
 Используйте эту опцию (ы), чтобы указать любые аргументы для любой команды, например:
 
 var install = require ("gulp-install"); 
 
 
 
 gulp.src (__ dirname + '/ templates / **') 
 
 .pipe (gulp.dest ('./')) 
 
 .pipe (install ({
 
 npm: '--production') , 
 
 беседка: {allowRoot: true}, 
 
 pip: ['--target', '.'] 
 
})); 
 
 options.commands 
  Тип:   Объект 
  По умолчанию:   null 
 Используйте эту опцию, чтобы добавить любую команду, которая будет запускаться для любого файла, например:
 
 var install = require ("gulp-install"); 
 
 
 
 gulp.src (__ dirname + '/ templates / **') 
 
 .pipe (gulp.dest ('./')) 
 
 .pipe (установить (команды {
 
: {
 
 'пакет .json ':' yarn '
 
}, 
 
 yarn: [' --extra ',' --args ',' --here '] 
 
})); 
 
 опций. Производство 
  Тип:   Логическое значение 
  По умолчанию:   ложь 
 Установите значение  true , если  npm install  следует добавить с параметром  --production , если поток содержит  package.json .
  Пример: 
 
 var install = require ("gulp-install"); 
 
 
 
 гл.src (__ dirname + '/ templates / **') 
 
 .pipe (gulp.dest ('./')) 
 
 .pipe (установить ({production: true})); 
 
 options.ignore Скрипты 
  Тип:   Логическое значение 
  По умолчанию:   ложь 
 Установите значение  true , если  npm install  следует добавить с параметром  --ignore-scripts , если поток содержит  package.json . Полезно для пропуска сценариев  postinstall  с  npm .
  Пример: 
 
 var install = require ("gulp-install"); 
 
 
 
 gulp.src (__ dirname + '/ templates / **') 
 
 .pipe (gulp.dest ('./')) 
 
 .pipe (установить ({ignoreScripts: true})); 
 
 опций.нет опционально 
  Тип:   Логическое значение 
  По умолчанию:   ложь 
 Установите значение  true , если  npm install  следует добавить с параметром  --no-optional , который предотвратит установку дополнительных зависимостей.
  Пример: 
 
 var install = require ("gulp-install"); 
 
 
 
 gulp.src (__ dirname + '/ templates / **') 
 
 .pipe (gulp.dest ('./')) 
 
 .pipe (install ({noOptional: true})); 
 
 options.allowRoot 
  Тип:   Логическое значение 
  По умолчанию:   ложь 
 Установите значение  true , если  bower install  следует добавить с параметром  --allow-root , если поток содержит  bower.json .
  Пример: 
 
 var install = require ("gulp-install"); 
 
 
 
 gulp.src (__ dirname + '/ templates / **') 
 
 .pipe (gulp.dest ('./')) 
 
 .pipe (install ({allowRoot: true})); 
 
 options.args 
  Тип:   Массив или строка 
  По умолчанию:   undefined 
 Укажите дополнительные аргументы, которые будут переданы командам установки.
  Пример: 
 
 var install = require ("gulp-install"); 
 
 
 
 gulp.src (__ dirname + '/ templates / **') 
 
 .pipe (gulp.dest ('./')) 
 
 .pipe (install ({
 
 args: ['dev', '- без усадочной пленки']} 
 
)); 
 
 Лицензия 
 Лицензия MIT
 Использование Gulp в Windows 
 Возьмем для примера Windows 10
 NodeJS установлен и настроен.
 cmd входит в окно командной строки Windows, входит в тестовый каталог C: Develop gulptest и запускается в тестовом каталоге, если создание не требуется.
 C: \ Разработка> mkdir gulptest
C: \ Develop> cd gulptest
C: \ Develop \ gulptest> npm init
Эта утилита проведет вас через создание файла package.json.
Он охватывает только самые распространенные элементы и пытается угадать разумные значения по умолчанию.

Подробную документацию по этим полям см. В `npm help json`.
и что именно они делают.C в любой момент бросить курить.
имя пакета: (gulptest)
версия: (1.0.0)
описание:
точка входа: (index.js)
тестовая команда:
репозиторий git:
ключевые слова:
автор:
лицензия: (ISC)
Собираюсь написать в C: \ Develop \ gulptest \ package.json:

{
  "name": "gulptest",
  "версия": "1.0.0",
  "описание": "",
  "main": "index.js",
  "scripts": {
    "test": "echo \" Ошибка: тест не указан \ "&& exit 1"
  },
  "автор": "",
  "лицензия": "ISC"
}


Это нормально? (да) 
 Затем он попросит вас ввести некоторую информацию о проекте, которую можно будет ввести позже, так что просто вернитесь полностью назад.Он сгенерирует в каталоге файл package.json.
 Глобальная установка gulp 
 C: \ Develop \ gulptest> npm установить gulp-cli -g
C: \ Develop \ gulptest> npm install gulp -g 
 Установите Gulp в проект 
 Введите следующую команду, чтобы установить gulp в текущий проект и сообщить package.json, что вы использовали gulp
.
 npm установить gulp -D 
 Установить плагины 
 npm установить gulp-uglify -D 
 Запишите файл gulpfile.js 
 // Получить глоток только что установлен
var gulp = require ('глоток')

// Получаем только что установленный модуль gulp-uglify
var uglify = require ('глоток-uglify')

// Сжимаем js файлы
// Запускаем эту задачу из командной строки, используя gulp uglifyscript
gulp.task ('uglifyscript', done => {
    // 1. Находим документ
    gulp.src ('src / js / *. js')
    // 2. Сжатые файлы
    .pipe (uglify ())
    // 3. Сохраняем сжатые файлы
    .pipe (gulp.dest ('расстояние / js'))

    сделано()
}) 
 глотков | WebStorm 
 WebStorm интегрируется с Gulp.js Task Runner. WebStorm анализирует файлы Gulpfile.js, распознавая определения задач, отображает задачи в виде дерева, позволяет перемещаться между задачей в дереве и ее определением в файле Gulpfile.js, а также поддерживает выполнение и отладку задач.
 Задачи Gulp.js можно запускать из дерева задач в специальном окне инструментов Gulp или из файла Gulpfile.js, запустив конфигурацию запуска Gulp.js, или как задачу перед запуском из другой конфигурации запуска. WebStorm показывает результат выполнения задачи в окне инструмента «Выполнить».Окно инструмента показывает вывод Grunt, сообщает о возникших ошибках, перечисляет пакеты или плагины, которые не были найдены, и т. Д. Имя последней выполненной задачи отображается в строке заголовка окна инструмента.
 Перед началом работы 
 Убедитесь, что на вашем компьютере установлен Node.js.
 Установка Gulp.js 
 Чтобы использовать Gulp в проекте WebStorm, вам понадобятся два пакета:
  •  Глобально установленный пакет gulp-cli (интерфейс командной строки Gulp) для выполнения команд Gulp.
  •  Пакет gulp, установленный в качестве зависимости разработки для построения дерева задач проекта и предоставления помощи в кодировании при редактировании файла Gulpfile.js. Узнайте больше о Gulpfile.js на официальном сайте Gulp.js.
 Чтобы установить gulp-cli глобально 
  •  Во встроенном терминале ( Alt + F12 ) введите:
      npm install -global gulp-cli 
 Чтобы установить Gulp.js в a project 
  •  Во встроенном терминале ( Alt + F12 ) введите:
      npm install gulp --save-dev 
 Вы также можете установить пакеты на Node.js и NPM, как описано в npm, pnpm и Yarn.
 Запуск задач Gulp.js из дерева задач 
 WebStorm позволяет легко и быстро запускать задачи Gulp.js прямо из дерева задач в окне инструмента Gulp. WebStorm автоматически создает временную конфигурацию запуска, которую вы можете сохранить и использовать позже при необходимости.
 Gulp.js начинает построение дерева задач, как только вы вызываете Gulp.js, выбирая «Показать задачи Gulp» в контекстном меню Gulpfile.js в окне инструмента «Проект» или в Gulpfile.js открыт в редакторе. Дерево построено в соответствии с файлом Gulpfile.js, для которого был вызван Gulp.js. Если в вашем проекте несколько файлов Gulpfile.js, вы можете построить отдельное дерево задач для каждого из них и запускать задачи, не отказываясь от ранее построенных деревьев задач. Каждое дерево отображается под отдельным узлом.
 Технически WebStorm вызывает Gulp.js и обрабатывает Gulpfile.js в соответствии с конфигурацией запуска Gulp.js по умолчанию. Делается это бесшумно и не требует никаких шагов с вашей стороны.
 Чтобы открыть окно инструмента Gulp 
 Когда вы впервые строите дерево задач во время текущего сеанса WebStorm, окно инструмента Gulp еще не открывается.
 По умолчанию WebStorm не распознает ES6 в Gulpfile.js и не может построить дерево задач. Чтобы решить эту проблему, обновите конфигурацию запуска Gulp.js по умолчанию.
 Чтобы построить дерево задач из ES6 Gulpfile.js 
  1.  В главном меню выберите.
  2.  В узле «Шаблоны» щелкните Gulp.js.
  3.  В открывшемся диалоговом окне «Конфигурация запуска / отладки: Gulp.js» введите  --harmony  в поле «Параметры узла» и нажмите «ОК».
 Чтобы построить дерево задач из окна инструмента Gulp 
  •  В окне инструмента Gulp щелкните на панели инструментов и выберите нужный файл Gulpfile.js из списка. По умолчанию WebStorm показывает файл Gulpfile.js в корне вашего проекта.
  •  Если у вас есть другой файл Gulpfile.js, нажмите Выбрать Gulpfile.js и выберите нужный файл Gulpfile.js в открывшемся диалоговом окне. WebStorm добавляет новый узел с путем к выбранному файлу Gulpfile.js в его заголовке и строит дерево задач под новым узлом.
 Для повторного построения дерева 
 Для сортировки задач в дереве по их именам 
  •  Щелкните на панели инструментов, выберите «Сортировать по» в меню, а затем выберите «Имя». 
     По умолчанию дерево показывает задачи в том порядке, в котором они определены в Gulpfile.js (опция Порядок определения).
 Для запуска задачи 
 Для запуска задачи по умолчанию 
 Для запуска нескольких задач 
 Для перехода к определению задачи 
 Запуск задач из Gulpfile.js 
  1.  Поместите курсор на определение задачи. задачу, которую нужно запустить, и выберите в контекстном меню команду Выполнить <имя задачи>. WebStorm создает и запускает временную конфигурацию запуска с именем выбранной задачи.
  2.  Чтобы сохранить автоматически созданную временную конфигурацию запуска, поместите курсор на определение задачи, для которой он был создан, и выберите Сохранить <имя задачи> в контекстном меню выбора.
 Запуск и отладка задач в соответствии с конфигурацией запуска 
 Помимо использования временных конфигураций запуска, которые WebStorm создает автоматически, вы можете создавать и запускать свои собственные конфигурации запуска Gulp.js.
 Чтобы создать конфигурацию запуска Gulp.js 
  1.  В главном меню выберите.
  2.  Щелкните на панели инструментов и выберите Gulp.js из списка. Откроется диалоговое окно «Запуск / отладка конфигурации: Gulp.js».
  3.  Укажите имя конфигурации запуска, задачи для запуска (используйте пробелы в качестве разделителей), расположение Gulpfile.js, в котором определены эти задачи, и путь к пакету gulp, установленному в корне текущего проекта.
  4.  Укажите интерпретатор Node.js для использования. Это может быть локальный интерпретатор Node.js или Node.js в подсистеме Windows для Linux.
     При желании укажите переменные среды для Node.js и аргументы для выполнения задач. Используйте формат  - <имя_параметра> <значение_параметра> , например:  --env development . Узнайте больше на официальном сайте Gulp.
 Для запуска задач 
 Для отладки задач 
  1.  Создайте конфигурацию запуска / отладки Gulp.js, как описано выше.
  2.  Откройте файл Gulpfile.js в редакторе и при необходимости установите в нем точки останова.
  3.  Чтобы начать сеанс отладки, выберите необходимую конфигурацию отладки из списка на главной панели инструментов и щелкните рядом со списком или выберите в главном меню.
  4.  В открывшемся окне инструмента отладки проанализируйте выполнение приостановленной задачи, выполните пошаговое выполнение задачи и т. Д., Как описано в разделах «Проверка приостановленной программы» и «Пошаговое выполнение программы».
 Чтобы запустить задачу Gulp как задачу перед запуском 
  1.  Откройте диалоговое окно Запуск / отладка конфигураций, выбрав в главном меню, и выберите необходимую конфигурацию из списка или создайте ее заново, щелкнув и выбрав значок соответствующий тип конфигурации запуска.
  2.  В открывшемся диалоговом окне щелкните в области «Перед запуском» и выберите в списке «Запустить задачу Gulp».
  3.  В открывшемся диалоговом окне задачи Gulp укажите Gulpfile.js, где определена требуемая задача, выберите задачу для выполнения и укажите аргументы для передачи инструменту Gulp.
     Укажите расположение интерпретатора Node.js, передаваемые ему параметры и путь к пакету gulp.
 Автоматический запуск задач Gulp.js 
 Если у вас есть задачи, которые вы запускаете на регулярной основе, вы можете добавить соответствующие конфигурации запуска в список задач запуска. Задачи будут выполняться автоматически при запуске проекта.
  1.  В диалоговом окне «Настройки / Предпочтения»  Ctrl + Alt + S  щелкните «Задачи при запуске» в разделе «Инструменты».
  2.  На открывшейся странице Startup Tasks щелкните на панели инструментов.
  3.  Из списка выберите необходимую конфигурацию запуска Gulp.js. Конфигурация добавлена ​​в список.
     Если в проекте нет подходящей конфигурации, щелкните и выберите «Редактировать конфигурации». Затем определите конфигурацию с необходимыми настройками в Run / Debug Configuration: Gulp.js открывается страница. При сохранении новой конфигурации она автоматически добавляется в список задач запуска.
 Последнее изменение: 20 мая 2021 г.
 Установка Gulp и настройка среды 
 В предыдущей статье мы узнали об основах Gulp Task runner. В этом руководстве мы изучим основные этапы установки Gulp.
 Основные шаги установки: 
 Шаг 1. Сначала нам нужно установить Node.js для запуска задач Gulp.Чтобы установить node.js, загрузите Node.js с https://nodejs.org/en/
 Загрузите последнюю версию функций zip-файла.
 Шаг 2. После загрузки последней версии установщика запустите программу установки, чтобы установить NodeJ на свой компьютер.
 Шаг 3 — После того, как вы закончите установку node.js на свой компьютер, установите переменные среды с помощью следующих шагов —
 Настройка переменных среды 
 Щелкните правой кнопкой мыши «Мой компьютер».
 Выберите «Свойства».
 Выберите вкладку «Дополнительно» и нажмите «Переменные среды».
 В окне «Переменные среды» дважды щелкните Путь, как показано на следующем экране.
 Нажмите кнопку «Редактировать», чтобы отредактировать переменную. Окно переменных, как показано на следующем снимке экрана. Добавьте путь к папке Node.js в поле Значение переменной как C: \ Program Files \ nodejs \ node_modules \ npm.
 В старых версиях Windows 
 Если в этот путь уже добавлены переменные, вам нужно поставить точку с запятой (;) после этого и добавить путь node.js, как показано —
 В окне 10 — 
 Окно 10 предоставило новый интерфейс для добавление нового значения в системную переменную или переменную среды.Нажмите «Создать», чтобы создать заполнитель для нового значения.
 Шаг 4. Откройте командную строку и введите следующую команду. Он отобразит версию Node.js, которую мы только что установили.
 node -v 
 Шаг 5. Чтобы установить пакеты узлов, нам понадобится менеджер пакетов узлов. Чтобы проверить версию npm, нам нужно запустить команду ниже.
 npm -v 
 Шаг 7. Чтобы установить средство запуска задач gulp, нажмите команду ниже.  -g  означает global, то есть gulp будет установлен глобально и будет доступен для всех проектов.
 npm install gulp -g 
 Шаг 6. Откройте командную строку и введите следующую команду. Он отобразит версию Node.js, которую мы только что установили.
 gulp -v 
 Установка GULP на windows 10 — GULP 
 Привет, Джулиан,
 Хахаха, да, это всегда разумный вариант! Чтобы сохранить репутацию, скажу: это была не моя машина…
 Нам удалось запустить его с помощью Cygwin. Для тех, кому интересно, я опубликую, как мы это сделали.
 Загрузите Cygwin отсюда: https://www.cygwin.com/
 Затем установите пакет, наступит момент, когда вам будет предложено выбрать дополнительные пакеты для установки. Вверху этого раздела есть панель поиска. Зайдите в строку поиска и найдите следующие термины:
  1.   vim:  Установите основной под названием «vim», мы также установили несколько других, чтобы быть уверенными, не зная, что может сработать. Если вы не знаете, что это такое, это просто инструмент для редактирования текста, который пригодится при использовании терминала.
  2.   gcc:  Я полагаю, это зависит от вашего набора микросхем, но мы установили все пакеты x86, которые были помечены как разработчики (или «разработчики»), а также другие, которые не были помечены каким-либо конкретным набором микросхем, чтобы быть в безопасности так что это ‘gcc-fortran’ и некоторые другие, также все помечены как ‘devel’.
  3.   make:  Установите make и cmake, простой поиск make вызовет оба из них, выберите пакеты, которые помечены просто «make» и «cmake», других мы не устанавливали.
  4.   others ?:  Возможно, были и другие, но у меня сейчас нет списка, если вы знаете о каких-либо других требованиях, разместите их ниже.
 После того, как вы загрузили все указанные выше пакеты, вы можете запустить команду компиляции в Cygwin так же, как в терминале Unix:   cd Src  , за которым следует   ./mkgulp  . Если вы столкнетесь с какими-либо проблемами во время компиляции, он, как правило, выдаст вам приглашение, которое сообщит вам, какие дополнительные пакеты вам нужно включить в установку Cygwin.Перезапустите установку Cygwin, выберите новые пакеты и попробуйте еще раз!
 Последнее замечание: в стандартном файле make gulp есть заголовок Include, который указывает на папку, которой нет в операционной системе Windows, это что-то вроде   usr / local / include  . Это означает, что при компиляции вы будете получать предупреждение при каждой компиляции, что   usr / local / include   является неправильным включением и не существует. Не беспокойтесь об этом, это не имеет значения для компиляции, и мы отлично скомпилировали и выполнили gulp!
 Теперь у вас должен быть рабочий двоичный файл gulp! Попробуйте запустить некоторые из примеров в папке примеров в Cygwin!
 Еще раз спасибо, Джулиан, за отличную информацию! К счастью, на этот раз мне не пришлось возиться с make-файлами !! Из интереса я вижу, что GULP сейчас 6.0, и казалось, что он отлично компилируется с gcc-10.2. *, В этом ли была цель обновления? Или есть еще новые функции?
 Ура,
 Коннор
 Настройте среду разработки SharePoint Framework 
  •  
  •  6 минут на чтение
 В этой статье 
 Вы можете использовать любой текстовый редактор для создания решений SharePoint Framework.Вы также можете использовать среду macOS, Windows или Linux.
 Вы также можете выполнить следующие действия, просмотрев это видео на канале 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 часто обновляется и доступен на нескольких платформах, включая macOS, Windows и Linux. Поскольку точные ссылки для скачивания часто меняются, на этой странице нет ссылок на них. Вместо этого используйте приведенные ниже сведения, чтобы определить, какой установщик загрузить для вашей платформы.
 Имейте в виду, что Node.js всегда поддерживает два разных выпуска: LTS и Текущая версия. SharePoint Framework поддерживается только в версиях LTS. Для получения дополнительной информации о выпусках долгосрочной поддержки (LTS) Node.js см .: Node.js> Выпуски.
 Подсказка
 Веб-сайт Node.js всегда рекомендует последнюю версию установщика как для LTS, так и для текущей версии. Чтобы загрузить определенные версии версий Node.js, используйте страницу Node.js> Загрузки> Предыдущие версии.
  •  Пользователи Windows могут использовать установщики  * .msi  для x86 или x64 в зависимости от вашей установки Windows. Обычно есть только два доступных файла  * .msi  с именами, подобными  node-v {номер-версии} -x [86 | 64] .msi .
    •  Пользователи
  •  macOS могут использовать установщик  * .pkg , который обычно называется  node-v {номер-версии} .pkg .
 Вы можете проверить, установлен ли у вас уже Node.js, включая установленную версию, выполнив следующую команду:
  узел -v
  
 SharePoint Framework v1.12.1 поддерживается в следующих версиях Node.js:
  •  Node.js v10.13.0 + ( Дубний )
  •  Node.js v12.13.0 + ( эрбий )
  •  Node.js v14.15.0 + ( Фермий )
 Осторожно
 Если вы создаете компоненты SharePoint Framework для локальных развертываний SharePoint, обратитесь к дополнительным страницам, перечисленным в разделе См. Также для получения дополнительной информации.
 Установите редактор кода 
 Для создания веб-части можно использовать любой редактор кода или среду IDE, поддерживающую разработку на стороне клиента, например:
 В шагах и примерах в этой документации используется код Visual Studio, но вы можете использовать любой редактор по вашему выбору.
 Набор инструментов для разработки и сборки SharePoint Framework использует различные популярные инструменты с открытым исходным кодом. Хотя большинство зависимостей включено в каждый проект, вам необходимо установить несколько зависимостей глобально на вашей рабочей станции.
 Подсказка
 Вы можете установить все три из следующих инструментов в одной строке:
  npm install gulp yo @ microsoft / generator-sharepoint --global
  
 Установить Gulp 
 Gulp — это средство выполнения задач на основе JavaScript, используемое для автоматизации повторяющихся задач.Цепочка инструментов сборки SharePoint Framework использует задачи Gulp для сборки проектов, создания пакетов JavaScript, а полученные пакеты используются для развертывания решений.
 Введите следующую команду для установки Gulp:
  npm install gulp --global
  
 Установите 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 не пользуются доверием в вашей среде разработки. Сначала необходимо настроить среду разработки, чтобы доверять сертификату.
 Вспомогательная задача включается в каждый проект SharePoint Framework в виде задачи gulp. Вы можете сделать это сейчас или подождать, пока не создадите свой первый проект, как описано в руководстве Создание первой клиентской веб-части SharePoint (Hello World, часть 1).
 После создания проекта с помощью генератора Yeoman для SharePoint Framework выполните следующую команду из корневой папки проекта.
  глоток 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.
 В зависимости от вашего сценария вам может потребоваться поддерживать разные среды разработки. Разработчики использовали следующие подходы для решения этих проблем:
  •  виртуальных машин
  •  Докер
  •  Диспетчер версий узлов (NVM)
  •   SharePoint Server 2016 использует SharePoint Framework (SPFx) v1.1. 
  •   SharePoint Server 2019 использует SharePoint Framework (SPFx) v1.4.1. 
 Устранение неисправностей 
 Проверить версию глобально установленных пакетов 
 Чтобы получить список всех глобально установленных пакетов, выполните следующую команду:
  список npm --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 за корпоративным веб-прокси
 См. Также 
 .
Добавить комментарий 
Ваш адрес email не будет опубликован. Обязательные поля помечены *