[转]简介Gulp, Grunt, Bower, 和 Npm 对Visual Studio的支持
本文转自:http://www.cnblogs.com/whitewolf/p/4009199.html
[原文发表地址]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这样的管理系统将客户端库作为软件包来管理。
ASP.NET客户端软件包的管理者,为什么不用 NuGet?或MSBuild?
你们中的一些人可能会问,为什么JavaScript不使用 NuGet?为什么不扩展 MSBuild 去构建 CSS/JS?原因很简单。因为已经有了丰富的系统,来做这种事情。对于服务器端库 (和一些客户端)来说,使用NuGet 就已经很棒了。npm和bower 上已经有了很多的,而且还会有更多的 CSS 和 JS 库。而对于服务器端的应用程序构建来说,使用MSBuild很棒,但当构建客户端应用程序时,它有些多余了。
所以,两者都可以使用。这些都是您工具包中的工具。添加Gulp,Grun,Bower,npm的支持(和将来需要其他东西) ,这意味着为ASP.NET前端开发者提供了一个更熟悉的环境。它允许 ASP.NET 开发人员引入 JS 和 CSS 库,使他们可以每天使用。
引入任务资源管理器
我们从你们中,以及整个社会收到了相当多的、关于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”这样的功能现在还在预览版中。但是他们终将会集成到最终的产品中。
你需要什么?
首先,你将需要Visual Studio 2013.3 ,3的意思是免费的更新”Update 3”。
- TRX-任务资源管理器Visual Studio 扩展
- NMP/NBower包智能感知-搜索NPM 和Bower包在线版,它直接附加智能感知功能。
可选的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” 。
作者:破 狼 出处:http://www.cnblogs.com/whitewolf/ 本文版权归作者,欢迎转载,但未经作者同意必须保留此段声明,且在文章页面明显位置给出原文连接,否则保留追究法律责任的权利。该文章也同时发布在我的独立博客中-个人独立博客、博客园--破狼和51CTO--破狼。
[转]简介Gulp, Grunt, Bower, 和 Npm 对Visual Studio的支持的更多相关文章
- 简介Gulp, Grunt, Bower, 和 Npm 对Visual Studio的支持
[原文发表地址]Introducing Gulp, Grunt, Bower, and npm support for Visual Studio Web 开发,特别是前端 Web 开发,正迅速变得像 ...
- 在 Visual Studio 2013 中使用 Grunt, Bower 和 NPM
在 Visual Studio 2015 中提供了对于 Grunt 和 Gulp 的内置支持,在 Visual Studio 2013 中怎么办呢?微软将 2015 中的特性作为几个独立的扩展发布出来 ...
- Ext JS学习第十六天 事件机制event(一) DotNet进阶系列(持续更新) 第一节:.Net版基于WebSocket的聊天室样例 第十五节:深入理解async和await的作用及各种适用场景和用法 第十五节:深入理解async和await的作用及各种适用场景和用法 前端自动化准备和详细配置(NVM、NPM/CNPM、NodeJs、NRM、WebPack、Gulp/Grunt、G
code&monkey Ext JS学习第十六天 事件机制event(一) 此文用来记录学习笔记: 休息了好几天,从今天开始继续保持更新,鞭策自己学习 今天我们来说一说什么是事件,对于事件 ...
- 前端自动化准备和详细配置(NVM、NPM/CNPM、NodeJs、NRM、WebPack、Gulp/Grunt、Git/SVN)
一. 各类概念和指令介绍 1. NVM (1). 全称:Node Version Manager,是一款针对Nodejs的版本管理工具,由于Node的版本很多,很多时候我要需要依赖多个版本,并且要求 ...
- 前端环境安装(node.js+npm+grunt+bower)
前端开发环境安装(本教程不带开发工具的安装教程,只是环境安装) 本人机器环境win7 64位. 一.node.js安装 进入官网下载node.js文件,http://www.nodejs.org/ 2 ...
- ASP.NET 5系列教程 (五):在Visual Studio 2015中使用Grunt、Bower开发Web程序
基于Visual Studio 2015,你可以: 方便的管理前端包,如jQuery, Bootstrap, 或Angular. 自动运行任务,如LESS.JavaScript压缩.JSLint.Ja ...
- bower 和 npm 的区别
前端技术和工程实践真的是突飞猛进啊,想当年,我这个半业余前端吭哧吭哧做页面的时候,哪有这么多东西可以用啊,现在先进到我都完全看不懂了.本文主要讲一下同是包管理器的bower和npm的差别. 主要也是在 ...
- bower 和 npm 的区别详细介绍
摘要: 本文讲的是bower 和 npm 的区别详细介绍, 简单的说,npm是进行后端开发中,使用的模块安装工具,而bower,是前端的模块安装工具. 比如,在安装express,socket.io时 ...
- 用Laravel+Grunt+Bower管理你的应用
来源:http://yansu.org/2014/03/10/grunt-bower-and-laravel.html 为什么这么选择? 如今开源盛行,从后端的各个类库,到如今前端的jQuery插件, ...
随机推荐
- [转]Docker 为什么这么火
本文来自:Docker为什么这么火 以及此文:http://cloud.51cto.com/art/201408/447966_1.htm Docker 我的理解是,相对于 VMware 的一个分支. ...
- 新建网站与新建Asp.Net Web 应用程序的区别
.net网站和应用程序区别,网站是动态执行的不用编译,他只依赖于自己的文档本身,甚至你用aspx里直接写jsp代码都可以,其实网站可以说只是在.net平台中打开的文档,相当于最初的记事本编码,他并不需 ...
- vs2017运行时修改代码Changes are not allowed while code is running.
vs2017代码运行时不允许进行更改 工具->选项->调试->常规->启用编辑并继续不选择“启用编辑并继续”,这样就可以在调试时修改cs代码了.
- Mongodb 集群加keyFile认证
介绍 自从远古计绳结开始,数据库的存储就注定了今天的地位和多样性,Nosql的出现更是解决了现有的关系型数据库无法解决的一些难题,对高性能,灵活度,扩展性,海量数据的问题.随之而出现的高速内存索引数据 ...
- Python开发一个WEB聊天室
项目实战:开发一个WEB聊天室 功能需求: 用户可以与好友一对一聊天 可以搜索.添加某人为好友 用户可以搜索和添加群 每个群有管理员可以审批用户的加群请求,群管理员可以用多个,群管理员可以删除.添加. ...
- php在线编辑本地文件方法共享
public function testfile() { $cfile='F:\phpStudy\WWW\thinkphp5practise\NNWinLoseConfig.ini'; $cfileh ...
- HTTP --meta详解
meta是html语言head区的一个辅助性标签.也许你认为这些代码可有可无.其实如果你能够用好meta标签,会给你带来意想不到的效果,meta标签的作用有:搜索引擎优化(SEO),定义页面使用语言, ...
- FORALL用法小结
本文主要翻译.整理了ORACLE官方文档上有关FORALL的部份内容,不妥之处,还希望多和大家交流. 在发送语句到SQL引擎前,FORALL语句告知PL/SQL 引擎批挷定输入集合.尽管FORALL语 ...
- VMware 克隆网卡无法启动
问题描述: 最近学习 hadoop,环境准备搭建在虚拟机之上,装好一台虚拟机克隆完成后,网卡无法启动. 多年前,初学 Linux 的时候,就遇到过这个问题,记录的笔记找不到了,简单记录一下. shel ...
- MVC各层的职责
Model(模型):模型代表着核心的业务逻辑和数据(不要理解成Model只是实体类) View(视图):视图应该关注与如何展示数据,而不应该包含任何业务逻辑(业务逻辑应写在Model中) Contro ...