Posted at

yeoman入門

More than 3 years have passed since last update.

yeomanの簡単な使い方をメモ。

osはCentOS6.5です。

公式ホームページ:http://yeoman.io/


概要

以下の3つのコマンドを使って、web開発を効率化する。

yo(おじさん):雛形作成

bower(鳥):パッケージ管理

grunt(猪):ビルド


インストール

node.jsを利用するので、インストール済みであること。

-gオプションはグローバルインストール。

パスの通ったディレクトリにインストールされ、全ユーザから利用できる。

$ npm install -g yo bower grunt-cli


雛形インストール

yoで使う雛形をインストールする。

雛形は http://yeoman.io/generators/ から検索できる。

↓は、webアプリケーション基本の雛形(jqueryやbootstrapを含む)をインストールする例。

$ npm install -g generator-webapp


プロジェクト作成

yoで指定する雛形はインストール時のgenerator-を除いた部分。

利用するパッケージを指定して、enter。

$ mkdir yo-test

$ cd yo-test
$ yo webapp


パッケージの追加

雛形に個別にパッケージを追加することができる。

パッケージ名はbower search [パッケージ名]で検索可能。

↓は、underscore.jsを追加する例。

$ bower install underscore --save


実行

デフォルト http://localhost:9000 でアクセス可能なwebサーバを立ち上げることができる。

localhost以外から接続する場合、Gruntfile.jsconnect.options.hostname0.0.0.0に修正した後にコマンドを実行。

ファイアウォールがある場合は、ポートも開けておくこと。

$ grunt serve


テスト

ビルドで必要なので、ビルド前に実行しておく。

$ grunt test


ビルド

ディレクトリdistに最適化されたモジュールが生成されるので、それをリリースする。

$ grunt