nativefierとは
1行でシングルページWebアプリケーションをデスクトップアプリ化してくれる優れもの
WebアプリをElectronでWrapし、Electron-packagerを使ってネイティブ( .exe .app ... )を出力するみたいです
Githubリポジトリ : [jiahaog/nativefier - Github]
(https://github.com/jiahaog/nativefier)
主としてOSX向けに開発したそうですが、Linux・Windowsでも動くそうです
インストール
npmでパッケージとして公開されています
$ npm install -g nativefier
もしnpm入ってない人はbrewなりapt-getなりでNode.js入れて、npmインスコすると幸せになれます
注)アプデが非常に激しいので、本記事も極力最新版の情報に更新しています
既に入っている人はnpm updateしてもらえると整合性が取れるかと思います...
使いかた
試しに
$ nativefier maps.google.com
とすると、カレントディレクトリにGoogle Maps- *フォルダが生成されます
中を覗くとライセンスなどと共に、お目当のデスクトップアプリが入っているかと思います。
生成されたアプリはこんな感じになりました
*認証の必要なWebサイトをアプリ化
Twtter , Whatsapp , Facebook Messenger など認証が必要なサイト(原文:Certain Websites)は --pretend--honest オプションをつけてやります
$ nativefier --honest "http://web.whatsapp.com"
アプリの名前を指定
--nameオプションで名前を指定することができます
$ nativefier --name "Google Map" "maps.google.com"
アプリのアイコンを指定
OSXでは--iconオプションで.icnsファイルを指定します
.icnsの詳しい作りかたは以下のサイトに委ねたいと思います
その他の主なオプション
基本的に
$ nativefier [options] <targetUrl> [dest]
と指定していきます。
| 項目 | 説明 |
|---|---|
| options | オプションをぶちこむ場所 |
| targetUrl | アプリケーションにしたいWebアプリのURL |
| dest | ビルドしたファイルを出力する場所 ( 省略した場合はカレントディレクトリ ) |
となってます
・高さ、幅指定
--width <value>
--height <value>
デフォルトはそれぞれ1280px,800pxです
・通知を表示
--counter
OSXのみ、Dockに通知を表示することができます(Webページが対応している場合)
・プラットフォーム、アーキテクチャの指定
-p, --platform <value>
-a, --arch <value>
プラットフォームはdarwin,linux,win32 アーキテクチャはia32かx64を指定できます。デフォルトでは自動で識別します。
・ヘルプの表示
-h, --help
使ってみた所感
私自身TweetDeckとFacebookなどはいつもブラウザで開きっぱなしでタブがかさばっていたので幾分か楽になった気がします
しばらくコードいじって遊んでみて、気が向いたらプルリクでもぶん投げようかなと思っている所存です
Electronいいっすね
