cordovaプロジェクトにjQueryを放り込む方法
時代はcordovaである！
時の権力者はそう言ったか、言わなかったらしい。
結局のところ権力者は誰かって話になる。
そう、権力者はいない。人はそれぞれ自分の人生の権力者であるとかうだうだ…
そんな感じで、今日のテーマはcordovaプロジェクトでjQueryを入れる方法を説明する。
始めにcordovaのバージョンを紹介する。
と言うのも変わったら絶対変わる
$ cordova -v 6.4.0
はい、6.4.0である。
んで、jQueryを組み込むってシンプルな話…
<script src="//code.jquery.com/jquery-1.11.1.min.js"></script>
で、十分じゃ？
と思うかもしれない。
しかし、ネットアクセスができない場合をcordovaの場合は考える必要がある。
そして、負けた気がする。
実際に、pluginとして、cordova-jqueryが準備されている。
cordova-jquery : https://www.npmjs.com/package/cordova-jquery
さっそく、ぶっ込む…
$ cordova plugin add cordova-jquery Fetching plugin "cordova-jquery" via npm Error: Cannot find plugin.xml for plugin "package". Please try adding it again.
ん？Fetchin pluginが通って…
plugin.xmlがない？packageに？
ってかpackageって何？ｗ
plugin.xmlって？
たぶん古い内容なんかな?
cordova-jquery@0.1.6
… メモ:記事書きながら調査したら入った
とりあえずnpmで取得できるのでゲットする…
プロジェクト内で、cordova-pluginを取得
$ npm install cordova-jquery ...
WARNが数件でましたが、入りました。
実行直下にnode_modulesディレクトリが作成されます。
cordova-jqueryディレクトリがあるのでこれでOK
次にプロジェクトにcordova-jqueryを実行します
$ node node_modules/cordova-jquery/cordova-jquery ? Would you like to add jQuery mobile to the current Apache Cordova project? Yes ? What would you like to do now that jQuery is enabled? (Use arrow keys) ❯ applyTemplate insertElement exit
はい、質問が来ますね。
テンプレートを適応？エレメントをぶち込む？
これで希望を言いましょう
applyTemplateを選ぶと、ひな形を聞かれます。
❯ multiPage headerNavbar persistentNavbar externalPanel accordion listView exit
とま、どちらか選ぶと無事に入ります。
疑り深い人はコマンドを実行してください。
$ ls www/js/ index.js jquery-1.5.0.mobile.min.css jquery-1.11.1.min.js jquery-1.5.0.mobile.min.js $ grep jquery www/index.html