LoginSignup
4

More than 5 years have passed since last update.

"Supercharging your Gruntfile"のGruntプラグインを試してみたの

Posted at

Supercharging your Gruntfileで紹介されていたプラグインをいくつか試してみたのです。

load-grunt-config (+ load-grunt-tasks)

Gruntfileに書く、各プラグインの記述を別ファイルに分割できるプラグイン。(と、loadNpmTasksを自動で検索・実行してくれるプラグインを内包している)

ディレクトリ構造とか試した設定などは以下のような感じ。grunt/以下のファイルは、jsかcoffeeもしくはyamlで書けるみたい。yamlならクォートで囲まなくて尚更、記述が楽かも。

ディレクトリ構造
|-- Gruntfile.coffee
|-- package.json
|-- coffee/
|-- jade/
|-- grunt/
    |-- aliases.coffee
    |-- coffee.coffee
    |-- jade.coffee
Gruntfile.coffee
module.exports = (grunt) -> require('load-grunt-config') grunt
package.json
{
  "private": true,
  "devDependencies": {
    "grunt": "*",
    "grunt-contrib-coffee": "*",
    "grunt-contrib-jade": "*",
    "load-grunt-config": "*"
  }
}
aliases.coffee
module.exports =
  default: [
    'jade'
    'coffee'
  ]
coffee.coffee
module.exports =
  compile:
    files: [
      expand: true
      ext: '.js'
      src: 'coffee/*.coffee'
    ]
  options:
    bare: true
    sourceMap: true
jade.coffee
module.exports =
  compile:
    files: [
      expand: true
      ext: '.html'
      src: 'jade/*.jade'
    ]
  options:
    pretty: true

これでGruntfile.coffeeのディレクトリに居るときに、$ gruntをすればjade/にあるjadeのファイルとcoffee/にあるcoffeescriptのファイルがコンパイルされる。

loadNpmTasksを書かなくて良くなった事と、設定が分散して書けるようになったからそれぞれの設定ファイルが見やすくなったことが利点かな。

grunt-newer

最後に成功したビルドのファイルを返してくれるプラグイン?

Terminal
$ npm install --save-dev grunt-newer
aliases.coffee
module.exports =
  default: [
    'newer:jade'
    'newer:coffee'
  ]

に変更して、わざとコンパイルに失敗するcoffeescript書いたけどよくわからない……

grunt-concurrent

タスクを並列実行してくれるプラグイン。

Terminal
$ npm install --save-dev grunt-concurrent
grunt/aliases.coffee
module.exports =
  default: [
    'concurrent:first'
  ]
grunt/concurrent.coffee
module.exports =
  first: [
    'jade'
    'coffee'
  ]

これで実行したら並列実行……してくれたみたいです。ファイル数多くしたり、ファイルサイズ大きくしたりしてないのでわかんないけど……
firstというタスクにjadecoffeeのタスクを書いているので、これらがそれぞれ並列で動作するみたい。secondというタスクを書いて、aliases.coffeeに追加すれば何かのタスクを並列実行したあとに別のタスクを実行するということもできるので、順を追って何かをする必要がある時にはそういう書き方もできるみたい。


time-gruntgrunt-notifyも使わなかったけど、これはこれであると便利かなーと思った。time-gruntはあまり使わなそうな気はするけど。

Register as a new user and use Qiita more conveniently

  1. You get articles that match your needs
  2. You can efficiently read back useful information
  3. You can use dark theme
What you can do with signing up
4