問題描述
Grunt、Gulp.js 和 Bower 之間有什么區別?為什么&何時以及如何使用它們?
我現在看到,大多數前端項目都使用上述工具,雖然我在使用它們就像在我最近的項目中一樣,我正在使用 gulp 使用像
這樣的腳本來構建 HTML、CSS 和 JavaScript$ gulp build
但是對所有這些前端框架都不太了解,請幫我對 Grunt、Gulp.js 和 Bower 有一個整體的了解.
在本質上和很多細節上,Gulp 和 Grunt 都是用于自動執行一系列相互依賴的任務的系統,通常用于定義項目的構建",例如現代風格在 make
工具上.通常,一個項目使用其中一個或另一個,但不能同時使用兩者(無論如何,對于相同的部分).
Bower 不同,它經常與 Gulp 或 Grunt 一起使用:它是客戶端庫的包管理器,易于維護這些庫是最新的,以標準化的方式指定它們及其依賴項,等等.
他們網站上的 Gulp 單線:
<塊引用>自動化和增強您的工作流程
他們的 Grunt 單線:
<塊引用>JavaScript 任務運行器
還有鮑爾:
<塊引用>網絡包管理器
<小時><塊引用>
為什么&什么時候用?
我認為以上內容適用于 Gulp 和 Grunt:如果您有想要自動化的任務(例如構建具有縮小、連接、壓縮等的網站的發布版本;或者查看文件以進行更改并重新運行當任務發生變化以支持快速開發時),您可以使用 Gulp 和 Grunt.
但這不僅僅是構建.您可以將 Gulp 和 Grunt 用于需要自動化的任何一系列任務.
Bower 可用于管理項目中的客戶端庫.您可以使用 Bower 安裝最新版本的 Bootstrap,它會將相關文件放在項目的標準位置.如果出現更新的 Bootstrap,Bower 可以更新這些文件.如果一個庫依賴于其他庫(例如,Bootstrap 的 JS 依賴于 jQuery),Bower 會幫助管理該樹.Grunt 有一些有用的任務(我假設是 Gulp),它們甚至可以自動將腳本和鏈接標簽添加到這些庫的 HTML 中,方法是在源 HTML 中有一個占位符,基本上說把 Bower 庫放在這里"./p>
What are the differences between Grunt, Gulp.js and Bower? Why & when and how to use them?
I've seen nowadays, most of the front-end project using the above tools, though I am using them like in my recent project I am using gulp to build HTML, CSS and JavaScript using a script like
$ gulp build
but don't have much understanding of all these front-end frameworks, please help me get an 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 有什么區別?為什么&什么時候使用它們?的文章就介紹到這了,希望我們推薦的答案對大家有所幫助,也希望大家多多支持html5模板網!