YEOMAN Advent Calendar 25日目：ジェネレータの作成とTravis CIの利用

ジェネレータ generator-generator を紹介します。このエントリーは「YEOMAN Advent Calendar 2014」12月25日の記事です。

YEOMAN Advent Calendar 2014 - Adventar

subgenerator を使う

前回は yo generator を実行し generator-helloworld を作りました。YEOMANジェネレータの魅力はサブジェネレータにもありますので実際に作ってみます。

$ yo generator
$ cd generator-helloworld
$ yo generator:subgenerator hoge

これでサブジェネレータのテンプレートが生成されます。

yo helloworld:hoge で実行されるファイルは次の通りです（少し変えてます）。このサブジェネレーターを色々と変更することで generator-angular-fullstack で幾つか定義されているサブジェネレータをつくることができます。

'use strict';
var yeoman = require('yeoman-generator');

module.exports = yeoman.generators.Base.extend({
  initializing: function () {
    this.argument('name', {
      required: true,
      type: String,
      desc: 'The subgenerator name'
    });

    this.log('You called the Helloworld subgenerator with the argument ' + this.name + '.');
  },

  writing: function () {
    this.fs.copy(
      this.templatePath('somefile.js'),
      this.destinationPath('app/scripts/somefile.js')
    );
  }
});

単体テスト

完成したら mocha テストを実行します。サブジェレテータを作ったときの単体テストモジュールは

'use strict';

var path = require('path');
var assert = require('yeoman-generator').assert;
var helpers = require('yeoman-generator').test;

describe('helloworld:hoge', function () {
  before(function (done) {
    helpers.run(path.join(__dirname, '../hoge'))
      .withArguments('name', '--force')
      .withOptions({ 'skip-install': true })
      .on('end', done);
  });

  it('creates files', function () {
    assert.file([
      'app/scripts/somefile.js'
    ]);
  });
});

実行するために mocha をインストールし単体テストを実行します。

$ npm install -g mocha
$ mocha --reporter spec ./test/test-hoge.js


  helloworld:hoge
    ✓ creates files 


  1 passing (57ms)
$

Travis CI を使う

作成したモジュールをgithubへ登録します。登録したらTravis CIとの連携をします。Travisを使うのは簡単でアカウントを作成しgithubとの連携を設定します。自分の名前が記載されている部分をクリックするとプルダウンリストが現れAccountsというのがありますのでクリックします。するとgithubに登録されているリポジトリの一覧が表示されます。

Travisに実行させるリポジトリーをオンにすると次回コミット時にテストが実行されます。参考までにログを添付します。

最後に

モダンWeb開発は以前とは比べ物にならないくらい開発するスキルが必要になりました。単純にHTML、CSS、JavaScriptを書くというだけでなくJavaScriptフレームワーク、CSSフレームワークなどを選び単体テスト・ツールとして何を使うか、CIをどうするか等々、様々なことを考慮する必要があります。今までの技術の延長線上では無いという認識が必要かもしれません。 多くのアーキテクチャを利用する場合統合開発ツールを利用し効率化をしますがそのひとつが「YEOMAN」です。YEOMANを使うことでモダンWeb開発をスムーズに行うことができます。逆にこうしたツールが提供している環境を無視したやり方は非常に非効率になります。提供されるベストプラクティスを何らかの理由で非効率にしていることがあり、ちょっとがっかりささられています（実際に手を動かさないマネージャにはこういったことが理解できないのか、もしくは今までと何が違うのか認識できていないのかはわかりませんが）。

まだまだHTMLは進化すると思われます。YEOMANのようなモダンWeb開発のためのツールを使ってより良いプロダクトが行えたらと思います。

お礼

皆様のお陰で無事アドベントカレンダーが終了しました。ご協力ありがとうございました。