grunt-init で jquery-plugin を作って travisCIに上げるまでのメモ
準備
以下をインストール
$ npm install -g grunt-init $ git clone https://github.com/gruntjs/grunt-init-jquery.git ~/.grunt-init/jquery
プロジェクトの作成
grunt-init jqueryをプロジェクトディレクトリで走らせるとplugin用のアセットを生成してくれる。
なお、既にルートディレクトリにpackage.jsonが存在するとエラーになる模。様l
$ mkdir eg-grunt-init $ cd eg-grunt-init $ grunt-init jquery
生成されたコード
.
├── CONTRIBUTING.md
├── Gruntfile.js
├── LICENSE-MIT
├── README.md
├── eg-grunt-init.jquery.json
├── libs
│ ├── jquery
│ │ └── jquery.js
│ ├── jquery-loader.js
│ └── qunit
│ ├── qunit.css
│ └── qunit.js
├── package.json
├── src
│ └── eg-grunt-init.js
└── test
├── eg-grunt-init.html
└── eg-grunt-init_test.js
とりあえず動かす
なにもオリジナルなコードは書かずに、そのまま動かす。
$ npm install $ npm test
すでにもうテストが動くという親切っぷり。 テストはqunitを使っている。そのまま使うか、mochaでも入れるか、は各自の自由なのかな。 また、jshintも設定されてるので、これに従えばjqueryの規約に沿ったコードになる様子。
サンプルコードは2indentで書かれているが、jshint的には特に規定はなく、そのまま4indentで書いてしまったが、好きに設定して良いのかもしれない。 まあ、minifyするか
pluginを実装する
かく。 テスト通らせる
travisCIに上げる
ここでちょっとあれこれしたのでメモ。
- grunt-cliをinstallする
- デフォルトではgrunt-cliが無いので、
npm install --save-dev grunt-cliした
- デフォルトではgrunt-cliが無いので、
- vesionかえる
- package.jsonに定義されているversionが
0.0.0-ignoredだったので、npmとれなかった気配 - versionやnpmの流儀についてはちゃんと調べずここまで来ているので、なんか勘違いしてるきもするけど、とりあえず動いたので。
- package.jsonに定義されているversionが
おしまい
grunt-initはべんりだなーって思った。 でもqunitは使いにくい。
あ、あと。jquery-formize on Githubというpluginを書きました。form要素にデータ入れたりデータ取ったりエラーのスタイル当てるのにいい感じにしてくれる子がほしかった。 この子を書くときにgrunt-initに入門したので、色々勉強になった。まる。
