[Перевод] Введение в Gulp, Grunt, Bower, и поддержка npm в Visual Studio
Вступление Веб разработка, а именно фронт-энд разработка становится, как и традиционная бэк-энд разработка, все комплекснее и мудренее. Множество проектов нуждаются в большем, нежели банальная закачка пары JS и CSS файлов по FTP. Сейчас мы можем наблюдать так называемый процесс сборки фронт-энда, который может включать компиляцию SASS и LESS, сжатие CSS/JS, запуск JSHint или JSLint и многое другое. Эти сборочные задачи и процессы координируются такими инструментами как Gulp или Grunt. Так же клиентскими библиотеками можно управлять используя различные системы управления пакетами как npm или bower.Для чего ASP.NET клиентские системы управления пакетами? Почему не NuGet? Почему не MSBuild? Некоторые из вас задаться вопросом — «а почему же не использовать JavaScript с NuGet?». Или например, «почему бы не написать еще одно расширение MSBuild для сборки CSS/JS?».Все просто. Потому что уже существует богатая экосистема заточенная под такого рода задачи. NuGet хорош для серверных библиотек (ну иногда и для клиентских может сгодится), но существует чертовски больше CSS и JS библиотек под npm и bower, приспособленных под это дело. MSBuild хорош для сборок ориентированных на стороне сервера, но может быть большим излишеством для сборки клиентских приложений.
Ну так как насчет использовать оба решения. Для этого есть предусмотренные инструменты. Добавление поддержки Gulp, Grunt, Bower и npm (ну и других плюшек, если понадобится в будущем) означает более адаптированную среду для фронт-энд разработчиков, работающих с ASP.NET. А так же это открывает двери для разработчиков ASP.NET в познании и использовании JS и CSS библиотек которые повседневно используются фронт-энд сообществом.
Введение в диспетчер запуска задач (Task Runner Explorer) Мы получили целую тонну запросов касающихся поддержки Grunt/Gulp от многих из вас и так же от сообщества в целом. Мы работаем над высококачественной поддержкой обоих менеджеров Grunt и Gulp в Visual Studio »14», с полной расширяемостью. Сейчас мы готовы представить вашему вниманию предварительную версию, вышеописанной поддержки, в виде расширения для VS2013 и мы будем рады если вы поможете нам, знакомясь и тестируя данное расширение.Сегодня мы представляем предварительно-ознакомительную версию нашего Диспетчер Запуска Задач в виде VSIX — расширения. Мы так же рекомендуем вам, два других VSIX — расширения для более удобного использования, представленного нами, функционала.
На заметку: Большинство функционала, включенного в эти несколько VSIX — расширений будут включены в Visual Studio, таким образом, вам не придется все их ставить в будущем. Все таки для данной предварительно-ознакомительной версии для VS2013 нам необходимы все эти расширения для того что бы представить вам наше решение в короткие сроки. Так же обратите внимание что на сегодняшний момент в Visual Studio Express будет работать только Task Runner Explorer, но начиная с VS14 весь функционал будет работать в свободной версии Visual Studio.Рассматривайте выше-переставленный набор функций как предварительную, DevLabs версию нежели чем что-то финальное и готовое решение из раздела VS Productivity Power Tools. Все это будет достигнуто в финальной версии продукта.
Что вам нужно?
Для начала, обзаведитесь Visual Studio 2013.3 — что подразумевает три бесплатных обновления.TRX расширение для Visual Studio Express
Расширение поддерживающее NPM/NBower — А именно поиск пакетов и автозаполнение
Необязательное расширение Gulp Launcher — добавляет npm install в контекстное меню дерева проектаБез данного расширения установка и удаление пакетов npm должны выполнятся извне
Если вы все же установили это расширение вам нужно будет выполнить правый клик на packages.json и нажать на npm install перед тем как запустить задачи grunt/gulp
Для того что бы открыть TRX (Task Runner Explorer), просто выполните правый щелчок мышью на gruntfile.js файле в вашем проекте: 
TRX обычно находится на нижней панели в VS и выглядит вот так:
Здесь видно что gruntfile.js был найден в корне одного и более проектов в решении. Здесь так же отображается функционал который позволяет вам запускать задачи реагируя на 4 разных события Visual Studio.
Для ассоциации цели или задачи с событием Visual Studio, просто выполните нажатие правой кнопки мышкой и выполните связывание: 
Для запуска цели или задачи просто кликните на последней и пред вами предстанет следующий терминал:
После установки расширения автозаполнения для менеджера пакетов вы заметите как легко добавить или обновить тот или иной пакет при правке вашего package.json для bower или npm.
Вы так же сможете лицезреть асинхроные всплывающие подсказки заполненные мета-данными.
Когда вы начнете тестирование помните что вам нужно запустить npm install перед использованием TRX для запуска задач Grunt.
Несколько слов от переводчика Спасибо всем за внимание, это мой первый перевод так что буду рад конструктивным замечаниям.Вот ссылка на оригинал
