Ответ 1
В то время как ответ Liviu Costea верен, мне все же понадобилось некоторое время, чтобы выяснить, как это делается на самом деле. Итак, вот мой пошаговый справочник, начинающийся с нового проекта ASP.NET 4.5.2 MVC. Это руководство включает в себя управление пакетами на стороне клиента с помощью беседки, но пока не закрывает связывание /grunt/ gulp.
Шаг 1 (Создать проект)
Создайте новый проект ASP.NET 4.5.2 (шаблон MVC) с помощью Visual Studio 2015.
Шаг 2 (Удалить объединение/Оптимизация из проекта)
Шаг 2.1
Удалите следующие пакеты Nuget:
- самозагрузки
- Microsoft.jQuery.Unobstrusive.Validation
- jQuery.Validation
- JQuery
- Microsoft.AspNet.Web.Optimization
- WebGrease
- Antlr
- Modernizr
- Ответить
Шаг 2.2
Удалите App_Start\BundleConfig.cs
из проекта.
Шаг 2.3
Удалить
using System.Web.Optimization;
и
BundleConfig.RegisterBundles(BundleTable.Bundles);
из Global.asax.cs
Шаг 2.4
Удалить
<add namespace="System.Web.Optimization"/>
от Views\Web.config
Шаг 2.5
Снимите монтажные привязки для System.Web.Optimization
и WebGrease
из Web.config
Шаг 3 (Добавить беседу к проекту)
Шаг 3.1
Добавить новый package.json
файл в проект (NPM configuration file
шаблон элемента)
Шаг 3.2
Добавьте bower
в devDependencies
:
{
"version": "1.0.0",
"name": "ASP.NET",
"private": true,
"devDependencies": {
"bower": "1.4.1"
}
}
Пакет bower автоматически устанавливается при сохранении package.json
.
Шаг 4 (настройка беседки)
Шаг 4.1
Добавить новый bower.json
файл в проект (Bower Configuration file
шаблон элемента)
Шаг 4.2
Добавьте bootstrap
, jquery-validation-unobtrusive
, modernizr
и respond
в зависимости:
{
"name": "ASP.NET",
"private": true,
"dependencies": {
"bootstrap": "*",
"jquery-validation-unobtrusive": "*",
"modernizr": "*",
"respond": "*"
}
}
Эти пакеты и их зависимости автоматически устанавливаются при сохранении bower.json
.
Шаг 5 (Изменить Views\Shared\_Layout.cshtml
)
Шаг 5.1
Заменить
@Styles.Render("~/Content/css")
с
<link rel="stylesheet" href="~/wwwroot/lib/bootstrap/dist/css/bootstrap.min.css" />
<link rel="stylesheet" href="~/Content/Site.css" />
Шаг 5.2
Заменить
@Scripts.Render("~/bundles/modernizr")
с
<script src="~/wwwroot/lib/modernizr/modernizr.js" ></script>
Шаг 5.3
Заменить
@Scripts.Render("~/bundles/jquery")
с
<script src="~/wwwroot/lib/jquery/dist/jquery.min.js"></script>
Шаг 5.4
Заменить
@Scripts.Render("~/bundles/bootstrap")
с
<script src="~/wwwroot/lib/bootstrap/dist/js/bootstrap.min.js"></script>
<script src="~/wwwroot/lib/respond/dest/respond.min.js"></script>
Шаг 6 (Изменить другие источники)
Во всех других представлениях замените
@Scripts.Render("~/bundles/jqueryval")
с
<script src="~/wwwroot/lib/jquery-validation/dist/jquery.validate.min.js"></script>
<script src="~/wwwroot/lib/jquery-validation-unobtrusive/jquery.validate.unobtrusive.min.js"></script>
Полезные ссылки
- http://idisposable.co.uk/2015/02/switching-the-client-side-build-library-in-visual-studio-2013-mvc-template-to-gulp-and-bower/
- http://www.baconapplications.com/running-bower-grunt-in-visual-studio-2013/
- http://devkimchi.com/1511/integrating-grunt-and-bower-with-visual-studio-2013/
- http://www.dotnetcurry.com/visualstudio/1096/using-grunt-gulp-bower-visual-studio-2013-2015
- http://andy-carter.com/blog/a-beginners-guide-to-package-manager-bower-and-using-gulp-to-manage-components
- http://www.jeffreyfritz.com/2015/05/where-did-my-asp-net-bundles-go-in-asp-net-5/
Объединение и минимизация
В комментариях ниже LavaHot рекомендует Bundler и Minifier extension в качестве замены для связующего по умолчанию, который я удаляю на шаге 2. Он также рекомендует эту статью по связыванию с Gulp.