Grunt,Gulp.js和Bower之间有什么不同?为什么&何时使用它们? [英] What are the differences between Grunt, Gulp.js and Bower? Why & when to use them?

查看:142
本文介绍了Grunt,Gulp.js和Bower之间有什么不同?为什么&何时使用它们?的处理方法,对大家解决问题具有一定的参考价值,需要的朋友们下面随着小编来一起学习吧!

问题描述

Grunt,Gulp.js和Bower有什么区别?为什么&何时以及如何使用它们?



我现在看到,大多数前端项目都使用上述工具,尽管我在最近的项目中使用它们我正在使用gulp来构建HTML,CSS和JavaScript脚本,如

  $ gulp build 

但是对所有这些前端框架没有太多的了解,请帮助我全面了解Grunt,Gulp.js和Bower。

解决方案

从本质上讲,并且大量挥手去掉细节, Gulp Grunt 都是用于自动化相互间任务系列的系统,通常用于定义构建您的项目,就像现代化的 make 工具。通常情况下,一个项目使用其中一个或另一个,但不能同时使用(对于相同的部分,无论如何)。



Bower 是不同的,并且经常与Gulp或Grunt一起使用:它是客户端库的包管理器,可以很容易地保持这些库处于最新状态,指定它们以及它们的依赖关系以标准化的方式,等等。

从他们的网站Gulp one-liner:


自动化并改善您的工作流程


来自他们的Grunt单线:


JavaScript Task Runner

And Bower:


网络包管理器







为什么&何时使用它们?


我认为上述内容涵盖了Gulp和Grunt:如果您有要自动执行的任务一个网站的发布版本,包括缩小,连接,压缩等;或者当它们改变以支持快速开发时观察文件的变化和重新运行的任务),你可以使用Gulp和Grunt来实现这一点。



但这不仅仅是构建。您可以将Gulp和Grunt用于任何需要自动执行的任务。

Bower可用于管理项目中的客户端库。您可以使用Bower安装Bootstrap的最新版本,并将相关文件放在项目的标准位置。如果更新的Bootstrap出来,Bower可以更新这些文件。如果一个库依赖于其他库(例如Bootstrap的JS依赖于jQuery),那么Bower可以帮助管理该树。对于Grunt(我假设为Gulp)有一些有用的任务,它们甚至可以通过在源HTML中占据一个占位符,基本上说将Bower库放在这里,从而自动将脚本和链接标记添加到HTML的HTML中。


What are the differences between Grunt, Gulp.js and Bower? Why & when and how to to use them?

I've seen nowadays, most of the front-end project use above tools, though I am using them like in my recent project I am using gulp to build HTML, CSS and JavaScript using script like

$ gulp build

but don't have much understanding of all these front-end frameworks, plese help me get overall understanding of Grunt, Gulp.js and Bower.

解决方案

In essence and with a lot of hand-waving away of details, Gulp and Grunt are both systems for automating serieses of inter-dependent tasks, commonly used for defining the "build" of your project, like a modern take on the make tool. Typically a project uses one of them or the other, but not both at the same time (for the same parts, anyway).

Bower is different, and frequently used with either Gulp or Grunt: It's a package manager for client-side libraries, making it easy to keep those libs up to date, specify them and their dependencies in a standardized way, and so forth.

The Gulp one-liner from their website:

Automate and enhance your workflow

The Grunt one-liner from theirs:

The JavaScript Task Runner

And Bower:

A package manager for the web


Why & when to use them?

I think the above covers that for Gulp and Grunt: If you have tasks you want to automate (like building the release version of a website with minification, concatenation, compression, etc.; or watching files for changes and re-running tasks when they change to support rapid development), you can use Gulp and Grunt for that.

But it's not just builds. You can use Gulp and Grunt for any series of tasks that you need to automate.

Bower is useful for managing the client-side libraries in your projects. You can use Bower to install, say, the latest version of Bootstrap, and it will put the relevant files in standard locations in your project. Bower can update those files if a newer Bootstrap comes out. If a library depends on other libraries (Bootstrap's JS relies on jQuery, for instance), Bower helps manage that tree. There are helpful tasks for Grunt (and I assume for Gulp) that can even automate adding the script and link tags to your HTML for those libraries, by having a placeholder in your source HTML that basically says "put the Bower libs here."

这篇关于Grunt,Gulp.js和Bower之间有什么不同?为什么&何时使用它们?的文章就介绍到这了,希望我们推荐的答案对大家有所帮助,也希望大家多多支持IT屋!

查看全文
相关文章
登录 关闭
扫码关注1秒登录
发送“验证码”获取 | 15天全站免登陆