jQuery プラグインを bower のレジストリに登録してみた
表題の通り、jQuery プラグイン jquery.narrows を bower のレジストリに登録してみた時の記録です。
bower とは?
こちらが非常に分かりやすかったです。
基礎編の冒頭から(勝手に)引用させて頂きますと、bower とは
Twitter社が作ったフロントエンド用のパッケージマネージャです。 Java で言う Maven、 Ruby で言う gem、 Perl で言う cpan のようなものです。 Node.jsには npm と呼ばれるパッケージマネージャがありますが、それに強く影響を受けています。
ということです。
bower のパッケージは bower レジストリってところで管理されています。 登録済みパッケージの一覧は Bower components ってページで見られます。検索もできます。
この bower レジストリにおいらの jQuery プラグインをいっちょ登録したるぜ!と思い立ちました。
bower レジストリに登録すると何が嬉しいの?
ここに登録しておけば、
bower search
で検索したり("sinon" は javascript のテスト用ライブラリです)
$ bower search sinon Search results: sinon git://github.com/cjohansen/Sinon.JS.git sinon-chai git://github.com/domenic/sinon-chai.git sinonjs git://github.com/blittle/sinon.js.git (以下略)
bower info
でインストール可能なバージョンを調べたり
$ bower info sinon bower sinon#* not-cached git://github.com/cjohansen/Sinon.JS.git#* bower sinon#* resolve git://github.com/cjohansen/Sinon.JS.git#* bower sinon#* download https://github.com/cjohansen/Sinon.JS/archive/v1.7.3.tar.gz bower sinon#* extract archive.tar.gz bower sinon#* resolved git://github.com/cjohansen/Sinon.JS.git#1.7.3 { name: 'sinon', homepage: 'https://github.com/cjohansen/Sinon.JS', version: '1.7.3' } Available versions: - 1.7.3 - 1.7.1 - 1.7.0 (中略) - 0.6.0 - 0.5.0 - 0.2.3 You can request info for a specific version with 'bower info sinon#<version>'
bower install
で指定したバージョンをダウンロードしたり出来ます。
$ bower install sinon#1.7.3 bower sinon#1.7.3 cached git://github.com/cjohansen/Sinon.JS.git#1.7.3 bower sinon#1.7.3 validate 1.7.3 against git://github.com/cjohansen/Sinon.JS.git#1.7.3 bower sinon#1.7.3 install sinon#1.7.3 sinon#1.7.3 bower_components/sinon
デフォルトで bower_components
ディレクトリ以下にダウンロードされます。
$ ls bower_components/sinon AUTHORS LICENSE build* lib/ release.sh* Changelog.txt README.md jsl.conf package.json test/
JavaScript ライブラリがコマンドラインだけでダウンロード出来ちゃうのがステキです。 いちいちググって、ダウンロードやら git clone やらして、って手間が不要です。
(あと npm の package.json の dependency や devDependency と同様の機能も備えますがここでは触れません)
bower レジストリ登録への道のり
という感じ。簡単。順に説明します。
0. bower をインストール
npm でインストール。
$ npm install -g bower $ bower -v 1.2.8
1. bower.json を作成
bower init
コマンドを叩いて質問に答えていくと bower.json の雛形が生成できます。
$ bower init [?] name: jquery.narrows [?] version: 0.3.1 [?] description: jQuery Hierselect Plugin [?] main file: jquery.narrows.js [?] keywords: jQuery,select,hierselect [?] authors: simon <xxxxx@gmail.com> [?] license: MIT [?] homepage: https://github.com/monmonmon/jquery.narrows [?] 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 accidentally published to the registry? [?] would you like to mark this package as private which prevents it from being accidentally published to the registry? No { name: 'jquery.narrows', main: 'jquery.narrows.js', version: '0.3.1', homepage: 'https://github.com/monmonmon/jquery.narrows', authors: [ 'simon <xxxxx@gmail.com>' ], description: 'jQuery Hierselect Plugin', keywords: [ 'jQuery', 'select', 'hierselect' ], license: 'MIT', ignore: [ '**/.*', 'node_modules', 'bower_components', 'test', 'tests' ] } [?] Looks good? Yes
それを手直しして、コミット。
$ vim bower.json $ git add bower.json $ git commit $ git push
ちなみに手直しした結果はこんな感じ。
{ "name": "jquery.narrows.js", "version": "0.3.1", // <-gitでのバージョン番号を記述 "description": "jQuery Hierselect Plugin", "license": "MIT", "main": "jquery.narrows.js", // <-パッケージのメインとなるファイル "ignore": [ // <-bower install した時にダウンロードさせたくないファイルのリスト "**/.*", "**/*.html", "Gruntfile.coffee", "node_modules", "README.md", "package.json", "lib", "spec" ] }
さっきのBower入門(応用編)にも書かれていますが、
"main" と "ignore" をキチンと書かないと bower install
した時に余計なものまでダウンロードしちゃって鬱陶しいので、気をつけて記述します。
(例えば Gruntfile.coffee
はライブラリ利用者には不要なので "ignore" に含めてます。)
あと "version" にも要注意。ここに書いたバージョン番号を、次で git tag でタグ付けします。
2. リリースバージョン番号をタグ付け
bower.json に書いたバージョン番号をタグ付けしてやります。 bower はこのバージョン番号に基いてパッケージを管理します。
$ git tag 0.3.1 $ git push --tags Total 0 (delta 0), reused 0 (delta 0) To git@github.com:monmonmon/jquery.narrows.git * [new tag] 0.3.1 -> 0.3.1
バージョン 0.3.1 がリリースされました。
3. bower register
さていよいよ、ライブラリをレジストリへ登録します。コマンドの書式は
bower register <my-package-name> <git-endpoint>
です。
$ bower register jquery.narrows git@github.com:monmonmon/jquery.narrows.git bower convert Converted git@github.com:monmonmon/jquery.narrows.git to git://github.com/monmonmon/jquery.narrows.git bower jquery.narrows#* resolve git://github.com/monmonmon/jquery.narrows.git#* bower jquery.narrows#* download https://github.com/monmonmon/jquery.narrows/archive/0.3.1.tar.gz bower jquery.narrows#* extract archive.tar.gz bower jquery.narrows#* resolved git://github.com/monmonmon/jquery.narrows.git#0.3.1 [?] Registering a package will make it installable via the registry (https://bower.herokuapp.com), continue? (Y/n) bower jquery.narrows register git://github.com/monmonmon/jquery.narrows.git Package jquery.narrows registered successfully! All valid semver tags on git://github.com/monmonmon/jquery.narrows.git will be available as versions. To publish a new version, just release a valid semver tag. Run bower info jquery.narrows to list the available versions.
ほんとに登録されたのか確認してみましょう。
$ bower info jquery.narrows bower jquery.narrows#* cached git://github.com/monmonmon/jquery.narrows.git#0.3.1 bower jquery.narrows#* validate 0.3.1 against git://github.com/monmonmon/jquery.narrows.git#* { name: 'jquery.narrows.js', version: '0.3.1', main: 'jquery.narrows.js', description: 'jQuery Hierselect Plugin', license: 'MIT', ignore: [ '**/.*', '**/*.html', 'Gruntfile.coffee', 'node_modules', 'README.md', 'package.json', 'lib', 'spec' ], homepage: 'https://github.com/monmonmon/jquery.narrows' } Available versions: - 0.3.1 You can request info for a specific version with 'bower info jquery.narrows#<version>'
出た出た!
Bower components でも、検索フィールドに "jquery.narrows" って入力するとちゃんと表示されました。
試しに bower install してみる
今登録したライブラリがちゃんと bower install
出来るかも実験してみましょう。
$ bower install jquery.narrows#0.3.1 bower jquery.narrows#0.3.1 cached git://github.com/monmonmon/jquery.narrows.git#0.3.1 bower jquery.narrows#0.3.1 validate 0.3.1 against git://github.com/monmonmon/jquery.narrows.git#0.3.1 bower jquery.narrows#0.3.1 install jquery.narrows#0.3.1 jquery.narrows#0.3.1 bower_components/jquery.narrows
そしたらホラホラ!
$ ls -l bower_components/jquery.narrows bower.json jquery.narrows.js jquery.narrows.min.js
ひゃっほい。
bowser.json の "ignore" をちゃんと書いたおかげで、余計なファイルを(ほぼ)含まずに js ファイルだけダウンロードすることが出来ました。(bower.json 自身だけ "ignore" に入れるのを忘れてたけど…笑)
というわけで
快適な bower ライフをお楽しみ下さい(とってつけた)