Nw.js into the Pit guide

What is Nw.js?

Nw.js is based on Chromium and Node.js runs, formerly known as Nodewebkit. This gives you the possibility of using HTML and JavaScript to make desktop applications. In the app you can directly invoke the various APIs of node. JS and the existing third-party packages. Because Chromium Node.js of the cross-platform, your application can also be cross-platform. Now there are many well-known applications that are based on the Nw.js implementation, which is some list of official statistics: https://github.com/nwjs/nw.js/wiki/List-of-apps-and-companies-using-nw.js

Getting Started

First download the latest version of the Nw.js, the official website address.
Let me take this nwjs-v0.12.3-win-x64 as an example and see what the documents are.

/app/The directory is the specific code of the project;
/package.jsonI added, wait to talk about its role;
The other files under the project root directory are nw.js.

Project structure

The specific code can go to GitHub onlookers;
I put the project code in the app directory, and then the version number to distinguish, such as here, the v0.0.1 purpose is to update the later version, the updated method will be detailed later;

/app/v0.0.1/assest/Put some resource files, the specific is not introduced, and so on will be introduced under /app/v0.0.1/assest/read.js ;

/app/v0.0.1/node_modules/Place some third-party packages and manage them through NPM;

/app/v0.0.1/index.htmlThe entry page of the project, where I demonstrated how to use a third-party package node-read to get the body of a Web page, the specific code can point here;

/app/v0.0.1/node-main.js/Specify in Package.json; You can also record the specific description of the error in the case of client crash, see here;

/app/v0.0.1/package.json/Tell Nw.js a variety of information configuration file, specific introduction to view here;

Package.json parsing

A description of each configuration item is viewed here;

{  "Name": "Demo-app",  "Main": "./app/v0.0.1/index.html",//Specify Project Main Page"Build": "1445048139741",//This is intended to be used to determine the version of the update"Version": "0.0.1",//Current Version"Homepage": "Http://nero-zou.com",  "description": "Nw.js Demo",  "Window": {    "title": "Nw.js Demo",//If Index.html does not have a title, the value is displayed here"Icon": "Assest/img/logo.png",    "Position": "Center",    "width": 1280,    "Height": 680,    "Toolbar":true,//whether to hide the window's tool bar"Frame":true,//whether to show the outermost frame, set to false after the window is minimized, maximized, closed there is no"Resizable":true,    "Min_width": 1028  },  "Node-main": "./app/v0.0.1/node-main.js",//node-main.js Location"Contributors": [    {      "Name": "Zhiqiang",      "Email": "[email protected]",      "Web": "http://nero-zou.com"    }  ],  "Dependencies": {//Dependent Packages"MD5": "1.2.1",    "Cheerio": "^0.19.0",    "Fetch": "^0.3.6",    "Node-read": "^0.1.6"  }}

Code Encryption Protection

In some cases, the code is still not directly exposed to the user, we can use V8 Snapshot way to achieve the purpose of code encryption protection;

The specific way is /nwjs.exe to use to run the nwjc source.js core.bin command, and then index.html use require(‘nw.gui‘).Window.get().evalNWBin(null, ‘./app/v0.0.1/core.bin‘); (note the path here, is relative to the location of the Nw.exe) to introduce the code into the project;
Can see changes that use V8 shapshot than unused;

Note that there are some restrictions on the use of V8 Snapshot, such as those officially mentioned;
There is the encryption code do not use the Let, const these keywords, I used to because this is always compiled do not pass;

Automatic Updates

There are two types of updates:

• Only the project code needs to be updated

• Nw.js itself also needs to be updated;

Typically, you do not encounter situations where you need to update the nw.js itself, because when a version of Nw.js is selected, it is identified, unless you encounter any unresolved bugs;

Let's first implement the code that only updates the project, which is relatively simple; the previous introduction of the project interface is the location of all the code where the /app/v0.0.1/ V0.0.1 is placed;
So if you want to update to V0.0.2, then we create a new folder /app/V0.0.2 , and then put the V0.0.2 code into this file, and then /package.json replace the new version, package.json so that after restarting the client, then read v0.0.2 the code. The specific update code will not be written, the new version of the code can be packaged into a zip package, and then the client download good, unzip the line.

The following said nw.js itself also need to update the situation, the current I have not met, so can only provide a thought, because Nw.exe in the run, we can not replace it, then definitely need to use another executable file to replace it, I guess the way nails are implemented is this idea:

Project Packaging and Publishing

It's usually packaged with NSIs, but don't forget to encrypt the code you need to protect before you pack, and then delete the source file. Do these machinery, the boring thing of course can't let oneself do, must use gulp.js come ah. Also can be in the way of code compression, file merge and so also dry.

Some little pits

The debugging tools inside can not break the point, Webstorm configurable, and then you can debug the breakpoint;
Use NSIs packaging do not forget to add Folder permissions control, or you will encounter the situation where the file could not be written;

Nw.js into the Pit guide