node-webkitを使用してデスクトップアプリを作成する

この投稿では、MacとWindowsで、Webアプリケーションのパッケージをデプロイして構築することにより、node-webkitの表面をかじっています。

警告:この投稿は古く、現在の最先端技術を反映していない可能性があります

まず、免責事項:ランニングについては説明しませんNode.jsコードですが、MacとWindowsで実行するためにWebアプリをパッケージ化するだけです。 Linuxもゲームの一部ですが、ここでは取り上げません。

node-webkitつまり、それがその作成者、Webランタイムから呼び出される方法です。

これは、Chromium(その名前にもかかわらず)とnode.jsに基づいています。これにより、ノード.jsのコードとモジュールをDOMから直接呼び出すことができ、Webテクノロジーを使用して作成されたネイティブアプリケーションに新しい可能性が開かれます。

この投稿では、ネイティブアプリケーションと同じように、MacとWindowsにWebアプリケーションのパッケージをデプロイして構築することで、その表面をかじっただけです。

アプリを実行する

まず、index.htmlファイルを紹介しましょう

<html>
  <body>
    <p>test</p>
  </body>
</html>

We also need a package.json file

{
  "name": "My Web App",
  "main": "index.html"
}

That’s it from the code-side! Really.

Now to run the app, download the runtime from the site https://github.com/rogerwang/node-webkit for your specific platform, and then you can call

1)
$ alias nw="open -n -a node-webkit '/PATH_TO_APP_DIRECTORY/'
$ ./nw

cd /PATH_TO_APP_DIRECTORY/ zip -r app.nw ./

You have now created a package of the app. You can double-click it on Mac, or drag over the node-webkit application on Windows, and it will run.

There are a lot of options you can now add to the package.json file https://github.com/rogerwang/node-webkit/wiki/Manifest-format, but that’s a start. You can for example hide the top bar with address and debugger, set the menu items, and decide pretty much all you need.

Now, let’s dig into packaging and distributing an app.

Package the app on the Mac

Unzip the node-webkit.app package downloaded from the node-webkit site.

Right-click, “Show package content”, go in Contents/Resources and copy there the app.nw file built with

$ zip -r app.nw ./

or alternatively, copy the app directory there and name it “app.nw”.

That’s it! You can now change the default icon and properties in the Contents/Info.plist file.

Package the app on Windows

Download the latest Windows package.

Copy the .nw file built using Zip in the package directory, alongside nw.exe, and call it app.nw

Run the command

copy /b nw.exe+app.nw app.exe

You can now remove the nw.exe & app.nw files, zip the directory and distribute the package. Your users will need to download the zip file, uncompress and then run the app.exe file contained.


More devtools tutorials: