NW.js初体验

最新推荐文章于 2021-06-27 16:53:05 发布

Aoulun

最新推荐文章于 2021-06-27 16:53:05 发布

阅读量8.4k

点赞数 1

分类专栏： web前端文章标签： html nw-js

本文链接：https://blog.csdn.net/Aoulun/article/details/51866572

版权

web前端专栏收录该内容

4 篇文章 0 订阅

订阅专栏

初步入门NW .js

最近初步开始学HTML和nw,走了不少弯路。在网页上语无伦次精神饱满的搜索，发现还是有很多地方没有搞好。目前也只是能跑通了。最为第一个博客，简短的说下自己的过程，有错误的地方，诚恳的希望大家批评指正。

准备

想跑通nw，可以按照下面的步骤慢慢搞起来。至于nw.js 是什么，有什么特点就不多说了，网上一哆嗦就一堆堆的。
本文主要还是想说下怎么跑通，至于有哪些配置，怎么编码，就不啰嗦了。个人觉得第一次先跑通了才能为后面的打下基础。

下载nw.js，http://dl.nwjs.io/ 后面会说明怎么用。有两个版本，我下的是release版的。SDK没有用过。
下载Enigma Virtual Box 并安装，怎么安装就不说了，傻瓜式的安装。http://enigmaprotector.com/en/aboutvb.html 后面会说怎么用。
下载谷歌浏览器chrome，我的主要是在Windows上运行的，其他的平台还没有试过。
详细的HTML学习可参考www.w3school.com.cn

跑通nw.js

1、先下载chrome浏览器，最新版的就好。
2、下载nw.js之后，把压缩文件解压到任何一个你想要的目录里面。例如我的解压缩到下面的文件夹里面

3、安装Enigma Virtual Box
4、在解压的nw.js文件夹你创建一个工程文件夹，里面至少包含两个文件，一个HTML文件和一个json文件。例如我在解压的文件里创建APP这样的工程目录，里面包含main.html和package.json文件。具体代码参见下面的代码部分。

5、代码写完之后，可直接拖动app文件夹到nw.exe上就可以运行。例如，

6、结果就是下面这样的，随便选择一个文件夹，就会弹出一个对话框，显示里面有什么东西。你也可以有其他的操作，不一定是弹出对话框。

另外，为了使我们的程序在各个平台上运行，就像把这个可执行文件copy到其他电脑，同样能够运行。那么Enigma Virtual Box。

代码块

HTML中代码

<html>
  <head>
    <title>Hello world !</title>
  </head>
  <body>
    <h1>NW.js runs immediately</h1>
    We are using node.js <script>document.write(process.version)</script>.
    <br/>
    <input type="file" id = "fd" onchange="load()" nwdirectory >

	<script>
	function load()
	{
		var fs = require('fs');

		var fd = document.getElementById("fd").value;

		var value;

		fs.readdir(fd, function(err, temp) {
			alert(temp);
		});
	}
	</script>
  </body>
</html>

package.json中代码
至于这里面还有其他的配置选项，可以参考其他的博客，说的很详细。这里只写了两个关键的。

{
  "name": "demo-app",
  "main": "main.html"
}

打包程序

1、进入app文件夹，选中所有的文件，压缩为.zip文件，然后，改名字。很简单的。例如我的改成app.nw。注意，这个地方后缀是.nw，之前测过，不改也可以。然后将它copy到nw.exe所在的目录。

2、生成内部的可执行文件，首先，打开windows下的命令行程序；其次，定位到nw.exe所在目录；最后，将app.nw和nw.exe 打包为一个当前目录可执行的文件。例如我的打包为appdemo.exe. 双击就可以运行。

3、打开Enigma Virtual Box，分别安装下面的步骤生成最终的exe.copy到认可地方均可运行。第二步中名字路径可以随便写。

结语

我也只是个初学者，为了跑通NW浪了很多网站，还有很多机关在里面，这个需要慢慢调理。有错误的地方，希望大家能够指正，共同进步。

关注公众号，获取更多信息
在这里插入图片描述

Aoulun

关注

1
点赞
踩
2

收藏

觉得还不错? 一键收藏
0
评论
NW.js初体验

初步入门NW .js最近初步开始学HTML和nw,走了不少弯路。在网页上语无伦次精神饱满的搜索，发现还是有很多地方没有搞好。目前也只是能跑通了。最为第一个博客，简短的说下自己的过程，有错误的地方，诚恳的希望大家批评指正。准备想跑通nw，可以按照下面的步骤慢慢搞起来。至于nw.js 是什么，有什么特点就不多说了，网上一哆嗦就一堆堆的。本文主要还是想说下怎么跑通，至于有哪些配置，怎么编码，就不啰嗦了
复制链接

扫一扫

专栏目录