ベストなフロント開発環境構築:Bowerのインストール

Grunt + Bower + Yeoman の組み合わせがフロント開発の環境構築・共有に現状最強との話を聞き、導入についてまとめていきます。

前提としてnode.jsとWindowsならGitShellが必要です。
Gruntの導入は以前の内容を参考(node.jsもこちらで導入)

BowerとはTwitterの作ったフロントエンド用のパッケージマネージャで、Mavenやgemなどと同等のものです。

下記コマンドでBowerをインストールします。

npm install bower -g

下記コマンドでバージョンが返ってくればインストール成功。

bower -v

次にBowerの初期化をします。
Gruntの時と同じく、環境作りたいプロジェクトフォルダに移動して下記コマンドを入力。

bower init

入力すると対話形式で設定が始まります。
全部Enterで飛ばしてしまって構いません。

[?] name: MyBower
[?] version: 0.0.0
[?] description:
[?] main file:
[?] keywords:
[?] authors:
[?] license: MIT
[?] homepage:
[?] set currently installed components as dependencies? Yes
[?] add commonly ignored files to ignore list? Yes
[?] would you like to mark this package as private which prevents it from being
[?] would you like to mark this package as private which prevents it from being accidentally published to the registry? No
{
  name: 'MyBower',
  version: '0.0.0',
  license: 'MIT',
  ignore: [
    '**/.*',
    'node_modules',
    'bower_components',
    'test',
    'tests'
  ]
}
[?] Looks good? Yes

するとフォルダ内にbower.jsonが生成されます。

これはGruntのpackage.jsonのように、自分のライブラリ情報を記録するためのファイルです。
これでひとまずBowerの導入が終わりました。

次回に続きます。