成人无码视频,亚洲精品久久久久av无码,午夜精品久久久久久毛片,亚洲 中文字幕 日韩 无码

資訊專(zhuān)欄INFORMATION COLUMN

享受 Grunt

Sike / 1906人閱讀

摘要：這些任務(wù)包括但不限于將源代碼編譯為二進(jìn)制文件打包二進(jìn)制文件運(yùn)行測(cè)試用例發(fā)布到線上環(huán)境添加文檔或發(fā)行注釋為什么很重要呢，因?yàn)樗芄?jié)省程序員的時(shí)間。

Update: 別用 Grunt 了，用 Gulp ！拜拜。

（原文發(fā)表于我的個(gè)人博客 http://frankfang.com/2013/12/29/grunt-is-awesome/ ，如有錯(cuò)
誤，還請(qǐng)賜教）

在生產(chǎn)環(huán)境中使用 Grunt 已經(jīng)有兩個(gè)多月了，是時(shí)候?qū)懸恍w會(huì)了。目前能在網(wǎng)上搜到不少入門(mén)教程，我這篇就不再贅述 使用 Grunt 的目的、安裝過(guò)程和配置方法等了，主要講一些實(shí)際工作時(shí)的思考。另外還涉及到 Bower 和 Yeoman。

Build Automation

Build Automation 就是「構(gòu)建自動(dòng)化」，Wiki 上的解釋是

  
構(gòu)建自動(dòng)化是將軟件開(kāi)發(fā)人員日常工作中的一系列任務(wù)自動(dòng)執(zhí)行。這些任務(wù)包括但不限于

  
  

將源代碼編譯為二進(jìn)制文件

  
打包二進(jìn)制文件

  
運(yùn)行測(cè)試用例

  
發(fā)布到線上環(huán)境

  
添加文檔或發(fā)行注釋

為什么 BA 很重要呢，因?yàn)樗芄?jié)省程序員的時(shí)間。重復(fù)性、可執(zhí)行的任務(wù)，本應(yīng)交給機(jī)器來(lái)完成。省時(shí)省力，多好。

P.S. 其實(shí) BA 不一定總是好的，見(jiàn)下圖

用 Grunt 之前

BA 具體到前端開(kāi)發(fā)，就包括但不限于以下任務(wù)

將 LESS/SCSS 和 CoffeeScript 編譯為 CSS 和 JS

將源代碼（JS、CSS、HTML）和圖片壓縮（以節(jié)省用戶帶寬）

打包或合并資源文件

對(duì)資源文件做版本控制

運(yùn)行測(cè)試用例

發(fā)布到線上環(huán)境

在 Grunt 之前，我們一般是怎么完成這些任務(wù)的呢？我們用了類(lèi)似的自動(dòng)構(gòu)建工具，如 Ant 或 Make。說(shuō)實(shí)話，Grunt 跟這些工具的區(qū)別可能僅僅是語(yǔ)言的選擇不同，但這正是吸引我們前端開(kāi)發(fā)者的一點(diǎn)——使用 JS 作為開(kāi)發(fā)語(yǔ)言。

Ant 我真是從沒(méi)用過(guò)， 因?yàn)槲艺娴目床欢?XML（其實(shí)我是忠實(shí)的 Java 黑你應(yīng)該知道吧）。Makefile，總感覺(jué)是 C/C++ 程序員用的東西，也無(wú)愛(ài)。

感謝 Grunt，我不用去學(xué)習(xí) Ant 和 Make，就可以按我的想法來(lái)做自動(dòng)構(gòu)建了。

Yeoman 和 Bower

一般來(lái)說(shuō)，用 Grunt 的同時(shí)都會(huì)配合著 Yeoman 和 Bower 來(lái)用。我先吐槽下這倆貨。

Bower 很好用，能節(jié)省我們寶貴的人生。不過(guò) bower list --path 有時(shí)候不能把文件的路徑打印完整，每次都要我費(fèi)勁去翻目錄，因?yàn)檫@些組件的開(kāi)發(fā)者沒(méi)有在 .bower.json 里添加 main 文件的配置，差評(píng)。

Yeoman 一般，能幫你寫(xiě)好初始模板、Gruntfile 和 Bower，但是有兩個(gè)缺點(diǎn)

一、臃腫

流行的 generator 添加了過(guò)多的任務(wù)而顯得十分臃腫！以 generator-backbone 為例，它添加了 25 項(xiàng) Grunt 任務(wù)，其中 9 項(xiàng)我不怎么想用，最氣人的是它還有一個(gè) compass 任務(wù)，要運(yùn)行這個(gè)任務(wù)我需要事先安裝 ruby！你敢再多依賴點(diǎn)兒別的東西嗎?。?/p>

二、可定制化差

我想改變一下 generator-backbone 里面的目錄結(jié)構(gòu)，廢老大力氣了。牽一發(fā)而動(dòng)全身，而且有些任務(wù)插件又沒(méi)有文檔，改起來(lái)提心吊膽的。

所以目前我還是沒(méi)有直接使用 Yeoman，只是借鑒了里面的 Gruntfile 的寫(xiě)法。并且在嘗試寫(xiě)自己的 generator。

用 Grunt 之后

我用 Grunt 做了哪些事呢？其實(shí)主要是兩方面：加快開(kāi)發(fā)和自動(dòng)構(gòu)建。

加快開(kāi)發(fā)

主要使用了 watch 任務(wù)。

由于我們?cè)陧?xiàng)目里采用了 LESS，所以我使用 Grunt 對(duì)其進(jìn)行實(shí)時(shí)編譯。

Live Reload 功能我并沒(méi)有使用，它很煩，經(jīng)常在我不想刷新頁(yè)面的時(shí)候幫我刷新了。而且速度也不夠快。

另外我讓 Grunt 實(shí)時(shí)運(yùn)行單元測(cè)試。

自動(dòng)構(gòu)建

這個(gè)過(guò)程主要交給 usemin 任務(wù)來(lái)完成。

它會(huì)合并文件、壓縮文件, 以及加版本信息。

我們的 git commit 即可觸發(fā) CI 來(lái)執(zhí)行 Grunt 命令，然后將其發(fā)布到線上環(huán)境。

Workflow

這就是傳說(shuō)中的 Workflow 啊，將我從繁雜的瑣事中解救出來(lái)了哇，有一種「世界如此美妙」的感覺(jué)！

簡(jiǎn)單來(lái)說(shuō)，只要在工作中遇到了 over and over again 的任務(wù)，我就會(huì)考慮把它放入 Grunt 中，作為 Workflow 的一個(gè)步驟。

這樣做的好處是什么呢？只有一個(gè)：把本該讓機(jī)器去做的事交給機(jī)器去做。

文章版權(quán)歸作者所有，未經(jīng)允許請(qǐng)勿轉(zhuǎn)載,若此文章存在違規(guī)行為，您可以聯(lián)系管理員刪除。

轉(zhuǎn)載請(qǐng)注明本文地址：http://m.hztianpu.com/yun/87447.html

相關(guān)文章

  • 切圖崽的自我修養(yǎng)－使用自動(dòng)化工具

    摘要：前言已爛想來(lái)大家對(duì)自動(dòng)化構(gòu)建工具已經(jīng)不陌生了，自動(dòng)化構(gòu)建工具可以幫開(kāi)發(fā)者省去很多重復(fù)勞動(dòng)比如語(yǔ)法糾錯(cuò)文件打包文件操作，合并壓縮等等常用的自動(dòng)化構(gòu)建工具有等等，這些構(gòu)建工具核心都是依賴第三方插件，通過(guò)顆?；蝿?wù)，再將這些任務(wù)按照合適的方式進(jìn)行 前言 F5已爛 showImg(https://segmentfault.com/img/bVyS47); 想來(lái)大家對(duì)自動(dòng)化構(gòu)建工具已經(jīng)不陌生了，...

    jayce 評(píng)論0 收藏0

  • 切圖崽的自我修養(yǎng)－使用自動(dòng)化工具

    摘要：前言已爛想來(lái)大家對(duì)自動(dòng)化構(gòu)建工具已經(jīng)不陌生了，自動(dòng)化構(gòu)建工具可以幫開(kāi)發(fā)者省去很多重復(fù)勞動(dòng)比如語(yǔ)法糾錯(cuò)文件打包文件操作，合并壓縮等等常用的自動(dòng)化構(gòu)建工具有等等，這些構(gòu)建工具核心都是依賴第三方插件，通過(guò)顆粒化任務(wù)，再將這些任務(wù)按照合適的方式進(jìn)行 前言 F5已爛 showImg(https://segmentfault.com/img/bVyS47); 想來(lái)大家對(duì)自動(dòng)化構(gòu)建工具已經(jīng)不陌生了，...

    GT 評(píng)論0 收藏0

  • 切圖崽的自我修養(yǎng)－使用自動(dòng)化工具

    摘要：前言已爛想來(lái)大家對(duì)自動(dòng)化構(gòu)建工具已經(jīng)不陌生了，自動(dòng)化構(gòu)建工具可以幫開(kāi)發(fā)者省去很多重復(fù)勞動(dòng)比如語(yǔ)法糾錯(cuò)文件打包文件操作，合并壓縮等等常用的自動(dòng)化構(gòu)建工具有等等，這些構(gòu)建工具核心都是依賴第三方插件，通過(guò)顆粒化任務(wù)，再將這些任務(wù)按照合適的方式進(jìn)行 前言 F5已爛 showImg(https://segmentfault.com/img/bVyS47); 想來(lái)大家對(duì)自動(dòng)化構(gòu)建工具已經(jīng)不陌生了，...

    luqiuwen 評(píng)論0 收藏0

  • 前端開(kāi)發(fā)學(xué)習(xí)-網(wǎng)址記錄

    摘要：不是一下子能看完綜合使用編程是一番怎樣的體驗(yàn)學(xué)習(xí)筆記網(wǎng)站前端開(kāi)發(fā)基礎(chǔ)算法題如何優(yōu)雅地使用如何優(yōu)雅地使用零度博客碼農(nóng)網(wǎng)伯樂(lè)在線什么是頁(yè)面渲染國(guó)外先更到這，還有太多網(wǎng)址，先歸類(lèi)一下再補(bǔ)充。 最近在復(fù)習(xí)JavaScript知識(shí)時(shí)遇到以前就不懂的閉包、上下文，雖然比以前理解深了一點(diǎn)，但還是懵，想緩一下。。就去看了其他。。把Git、Grunt、Gulp、jQuery、jQuery UI、Reac...

    CatalpaFlat 評(píng)論0 收藏0

發(fā)表評(píng)論

0條評(píng)論

閱讀需要支付1元查看
<