#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いいっすね