VisualStudio2015为ASP.NET5项目提供了对Grunt、Bower、Gulp和NPM等工具的内置支持。然而,当我使用Visual Studio 2015创建一个ASP.NET 4.5.2项目时,它没有使用这些工具。我想使用bower而不是nuget来管理客户端包。我可以找到有关在Visual Studio 2013中使用这些工具的信息(例如,请参见this问题)。但我猜Visual Studio 2015的过程是不同的,因为它内置了对这些工具的支持。
jdg4fx2g1#
虽然Liviu Costea's answer是正确的,但我还是花了相当长的时间来弄清楚它实际上是如何完成的。所以这里是我从一个新的ASP.NET 4.5.2 MVC项目开始的一步一步的指南。这个指南包括使用bower的客户端包管理,但(还)没有包括捆绑/咕哝/ Gulp 。
使用Visual Studio 2015创建新的ASP.NET 4.5.2项目(MVC模板)。
卸载以下Nuget软件包:
从项目中删除App_Start\BundleConfig.cs。
App_Start\BundleConfig.cs
移除
using System.Web.Optimization;
以及
BundleConfig.RegisterBundles(BundleTable.Bundles);
从Global.asax.cs开始
Global.asax.cs
<add namespace="System.Web.Optimization"/>
从Views\Web.config开始
Views\Web.config
从Web.config中删除System.Web.Optimization和WebGrease的程序集绑定
Web.config
System.Web.Optimization
WebGrease
将新package.json文件添加到项目(NPM configuration file条目模板)
package.json
NPM configuration file
将bower添加到devDependencies:
bower
devDependencies
{ "version": "1.0.0", "name": "ASP.NET", "private": true, "devDependencies": { "bower": "1.4.1" } }
保存package.json时会自动安装bower包。
将新bower.json文件添加到项目(Bower Configuration file条目模板)
bower.json
Bower Configuration file
将bootstrap、jquery-validation-unobtrusive、modernizr和respond添加到依赖项:
bootstrap
jquery-validation-unobtrusive
modernizr
respond
{ "name": "ASP.NET", "private": true, "dependencies": { "bootstrap": "*", "jquery-validation-unobtrusive": "*", "modernizr": "*", "respond": "*" } }
这些软件包及其依赖项会在保存bower.json时自动安装。
Views\Shared\_Layout.cshtml
替换
@Styles.Render("~/Content/css")
与
<link rel="stylesheet" href="~/wwwroot/lib/bootstrap/dist/css/bootstrap.min.css" /> <link rel="stylesheet" href="~/Content/Site.css" />
型
@Scripts.Render("~/bundles/modernizr")
<script src="~/wwwroot/lib/modernizr/modernizr.js" ></script>
@Scripts.Render("~/bundles/jquery")
<script src="~/wwwroot/lib/jquery/dist/jquery.min.js"></script>
更换
@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>
在所有其他视图中,替换
@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>
在下面的评论中,LavaHot推荐Bundler & Minifier extension作为我在步骤2中删除的默认捆绑器的替代品。他还推荐this article与Gulp捆绑。
wvyml7n52#
实际上并没有太大的不同,只是Visual Studio内部对所有这些都有更好的支持,例如,当你添加新项目时,你有bower或npm配置文件的模板,还有gulp或grunt配置文件的模板。但实际调用grunt/gulp任务并将其绑定到构建事件仍然是使用Task Runner Explorer完成的,就像在VS 2013中一样。
2条答案
按热度按时间jdg4fx2g1#
虽然Liviu Costea's answer是正确的,但我还是花了相当长的时间来弄清楚它实际上是如何完成的。所以这里是我从一个新的ASP.NET 4.5.2 MVC项目开始的一步一步的指南。这个指南包括使用bower的客户端包管理,但(还)没有包括捆绑/咕哝/ Gulp 。
步骤1(创建项目)
使用Visual Studio 2015创建新的ASP.NET 4.5.2项目(MVC模板)。
步骤2(从项目中删除捆绑/优化)
步骤2.1
卸载以下Nuget软件包:
步骤2.2
从项目中删除
App_Start\BundleConfig.cs
。步骤2.3
移除
以及
从
Global.asax.cs
开始步骤2.4
移除
从
Views\Web.config
开始步骤2.5
从
Web.config
中删除System.Web.Optimization
和WebGrease
的程序集绑定第3步(将凉亭添加到项目)
步骤3.1
将新
package.json
文件添加到项目(NPM configuration file
条目模板)步骤3.2
将
bower
添加到devDependencies
:保存
package.json
时会自动安装bower包。步骤4(配置bower)
步骤4.1
将新
bower.json
文件添加到项目(Bower Configuration file
条目模板)步骤4.2
将
bootstrap
、jquery-validation-unobtrusive
、modernizr
和respond
添加到依赖项:这些软件包及其依赖项会在保存
bower.json
时自动安装。步骤5(修改
Views\Shared\_Layout.cshtml
)步骤5.1
替换
与
型
步骤5.2
替换
与
步骤5.3
替换
与
步骤5.4
更换
与
第6步(修改其他信号源)
在所有其他视图中,替换
与
有用链接
捆绑和缩小
在下面的评论中,LavaHot推荐Bundler & Minifier extension作为我在步骤2中删除的默认捆绑器的替代品。他还推荐this article与Gulp捆绑。
wvyml7n52#
实际上并没有太大的不同,只是Visual Studio内部对所有这些都有更好的支持,例如,当你添加新项目时,你有bower或npm配置文件的模板,还有gulp或grunt配置文件的模板。
但实际调用grunt/gulp任务并将其绑定到构建事件仍然是使用Task Runner Explorer完成的,就像在VS 2013中一样。