简介Gulp, Grunt, Bower, 和 Npm 对Visual Studio的支持

[原文发表地址]Introducing Gulp, Grunt, Bower, and npm support for Visual Studio前端

Web 开发,特别是前端 Web 开发,正迅速变得像传统的后端开发同样复杂和精密。大多数项目不只仅是经过 FTP上传一些 JS 和 CSS 文件。而如今的前端生成过程,能够囊括SASS 和LESS扩展、CSS/JS的压缩包、JSHint 或 JSLint的运行时 、或者更多。这些生成任务和进程都和像Gulp和Grunt这样的工具一块儿协调工做。此外,相似于npm和bower这样的管理系统将客户端库做为软件包来管理。npm

ASP.NET客户端软件包的管理者,为何不用 NuGet?或MSBuild?

大家中的一些人可能会问,为何JavaScript不使用 NuGet?为何不扩展 MSBuild 去构建 CSS/JS?缘由很简单。由于已经有了丰富的系统,来作这种事情。对于服务器端库 (和一些客户端)来讲,使用NuGet 就已经很棒了。npm和bower 上已经有了不少的,并且还会有更多的 CSS 和 JS 库。而对于服务器端的应用程序构建来讲,使用MSBuild很棒,但当构建客户端应用程序时,它有些多余了。json

因此,二者均可以使用。这些都是您工具包中的工具。添加Gulp,Grun,Bower,npm的支持(和未来须要其余东西) ,这意味着为ASP.NET前端开发者提供了一个更熟悉的环境。它容许 ASP.NET 开发人员引入 JS 和 CSS 库,使他们能够天天使用。gulp

引入任务资源管理器

咱们从大家中,以及整个社会收到了至关多的、关于Grunt/Gulp的功能请求。咱们利用Visual Studio “14的充分可扩展性正在构建对Grunt/Gulp第一流的支持。如今咱们已经准备好将这个支持做为VS2013的一个扩展加入到预览版本中, 而且咱们感激您帮助咱们测试和考察这个功能。后端

今天咱们介绍一个预览版本,在这个预览版本中,“任务资源管理器”将做为VSIX的一个扩展。同时也推荐两个其余的VSIX来完善对这个功能的体验。服务器

注意:VSIX扩展中的大多数功能都被内置到Visual Studio中,所以你不须要安装其余别的东西。并且,VS2013和此预览版本中咱们须要更多的VSIX,让你早晚能获得这些扩展。请注意,今天任务资源管理器只工做于Vsiaual Studio Express 版本中,但VS14的全部功能都将出如今VS免费版本中。异步

相似于VS Productivity Power Tools同样, “DevLabs”这样的功能如今还在预览版中。可是他们终将会集成到最终的产品中。grunt

你须要什么?
首先,你将须要Visual Studio 2013.3 ,3的意思是免费的更新”Update 3”。
  1. TRX-任务资源管理器Visual Studio 扩展
  2. NMP/NBower包智能感知-搜索NPM 和Bower包在线版,它直接附加智能感知功能。
  3. 可选的Grunt Launcher(在解决方案资源管理器上右键单击选项— — 你会看到” npm install “)工具

    • 若是你如今没有这种扩展,那么你将须要本身运行npm install来还原/添加软件包
    • 若是你有这种扩展,那么请在运行grunt/gulp以前,右键单击 packages.json 和”npm install”

要打开 TRX (任务资源管理器),只需用鼠标右键单击您的项目中任何一个 gruntfile.js文件:测试

默认状况下,TRX 位于VS的底部,,看起来像这样:

在这里,咱们看到 gruntfile.js 在该解决方案中的一个或多个项目的根目录中。它还有任务绑定功能,也就是说任何任务或目标能够由 4 不一样 Visual Studio 事件触发。

要想将一个任务/目标和一个VS事件绑定在一块儿,只需右键单击进行绑定设置。

要想运行任何一个任务/目标,只需双击它,而后控制台将显示以下:

当你有了软件包智能感知扩展功能时,你会发现经过bower 和 npm来直接编辑package.json很容易添加并更新软件包。

甚至,你也有了异步填充元数据工具提示功能。

如今你能够去测试它了,记住在你用任务资源管理器来运行Grunt任务以前,你须要运行“ npm install” 。

相关文章
相关标签/搜索