node-webkit is a combination of Chromium and on. Through it, we can package web applications built on chrome browsers and on desktop applications, and it can also be cross-platform. Obviously, compared with traditional desktop applications, web applications developed with html5+css3+js in certain specific fields are simpler and more efficient, and can also use functions, so node-webkit is still very useful.
Next, I will introduce how to package a web application into an executable file through a simple demo (I will only introduce the Windows environment here)
First, create a new file as the entrance page of our demo. Let’s regard this page as a complete web application for the time being. Write something casually, such as:
Then create a configuration file, the content is as follows:
The main attribute is used to specify the entry file. The value of this attribute can be a local file or a remote URL, which is equivalent to turning a remote web application into a desktop application directly.
In addition to the two attributes name and main, there are many other useful attributes that can be configured, such as specifying the application icon, whether to display the browser's toolbar, specifying the initial size of the browser, etc. For specific configuration parameters, please see here./rogerwang/node-webkit/wiki/Manifest-format
Now we have two files.
Then compress the two files into a zip compressed package and name it
Now the content in this compressed package should look like this:
Then change the extension of this file to nw and change it to
Then download a Windows version of node-webkit, and then decompress it to get a folder:
After that, the file we got before can be used for execution, just drag it on. The operation results are as follows:
The effect is similar to opening this page in Chrome. Of course, you can configure this file to hide the browser's toolbar or border to make it more like a desktop software.
Because the operation of nw file requires the support of the node-webkit environment, we also need to package this file with the node-webkit environment file into an executable file.
First open the cmd of Windows, and then enter the following command:
copy /b +
Note that the file path needs to be changed according to your actual situation. Assume here, it is placed in the main folder of node-webkit, and the output will also be in this folder.
After executing the command, we get this executable file.
At this point, we have already obtained this file, but if this file is only still not enough, the executable file needs to support several DLL files.
Among them, both files with this are necessary.
Files are media support files. If your html page uses <video> or <audio> or other media-related things, you must bring this file with you.
And these two files are required to use webGL or GPU.
Finally, we get a folder like this:
Execute and run our demo.
But most of us want to give the user an exe file, so the user can use it without having to attach some other files.
Well, so we can also package other files again and turn all the files in the picture above into an executable file. As long as the user gets this file, he can run our application.
To do this step, we need a software called Enigma Virtual Box. First download and install the software, and then open it.
Then enter our path in Enter Input File Name, and fill in the Enter Output File Name where we want to output the packaged executable file. Finally, drag other files into Files. If you encounter a prompt, it will be fine by default.
Finally, click the Process button in the lower right corner and the job is done.
Finally, we get a file of app_boxed.exe, and as long as we hand over this file to the user, the user can run it.
Although node-webkit is convenient, it has a big disadvantage that the executable file obtained is a bit large, and you can decide not to use it after measuring the pros and cons.