node-webkit开发IM持续踩坑日志(二)

windows环境下打包windows与Mac包

这几天一直在做关于nw.js问题,发现网上很多资料都是时间比较久远,且不适合入门级开发,现根据自己踩坑记录,做了一下总结

一、下载Nw.js


下载传送门Nw.js
目前只试用过windows与Mac版本,直接在这里下载会比较慢,建议直接在上面的淘宝NPM镜像下载,都是一样的

二、创建一个简单的NW.JS项目

下载之后打开压缩文件
在这里插入图片描述

新建package.json文件

新建之后一路回车就好

npm init
{
  "name": "nwjs-v0.45.6-win-x64"
  "version": "1.0.0",
  "description": "",
  "main": "app/index.html",// main文件配置入口文件路径,允许为URL
  "scripts": {
    "test": "echo \"Error: no test specified\" && exit 1"
  },
  "author": "",
  "license": "ISC"
}
四、新建app目录

app目录下则是你的前端代码
在这里插入图片描述
index.html

<!DOCTYPE html>
<html lang="zh">
<head>
	<meta charset="UTF-8">
	<meta name="viewport" content="width=device-width, initial-scale=1.0">
	<meta http-equiv="X-UA-Compatible" content="ie=edge">
	<title></title>
</head>
<body>
	<script type="text/javascript">
		document.write('Hello,Nw.js')
	</script>
</body>
</html>

此时你构建的是绿色(免安装)版

PS:到这里已经算成功了,双击nw.exe体验你的第一个属于javascript客户端吧

* * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * *

* * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * *

* * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * *

********************** 分界线 ***********************

* * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * *

* * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * *

打包构建安装运行版本(nwjs-builder-phoenix)

修改package.json

{
  "name": "nwjs-v0.45.6-win-x64",
  "version": "1.0.0",
  "description": "",
  "main": "app/index.html",
  "scripts": {
  	"start": "run -x64 --mirror https://npm.taobao.org/mirrors/nwjs/ .",
  	"dist": "build --tasks win-x64,mac-x64 --mirror https://npm.taobao.org/mirrors/nwjs/ ."
  },
  "build": {
  	"nwVersion": "0.14.7"
  },
  "author": "classLfz",
  "license": "ISC",
  "devDependencies": {
		"nwjs-builder-phoenix": "^1.15.0"
	}
}

npm install  || cnpm install

安装项目需要依赖以及nwjs-builder-phoenix

npm run dist

接下来只需要静静等待~ ~ ~
~
~
~
~
~
~
在这里插入图片描述
接下来出现这两个目录,windwos可以直接用,Mac版直接压缩发给他就行

到这里,打包也OK了~

但是你会发现,你拖拽exe文件去其他目录并不行,那是因为这是绿色版,如果要单文件版,请往下看

* * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * *

* * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * *

* * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * *

********************** 分界线 ***********************

* * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * *

* * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * *

Enigma Virtual Box 封包

选中App目录以及package.json压缩
在这里插入图片描述
压缩完了得到一个nwjs-v0.45.6-win-x64.zip 并改名为app.nw
在这里插入图片描述
在这里插入图片描述
这里打开命令行,根目录下执行
ps:这里有个小坑,在根目录下直接shift+右键会报错,我是win+R打开CMD,然后cd进入目录执行

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

在这里插入图片描述
执行完会得到一个app.exe

然后打开百度,搜索下载Enigma Virtual Box,这里我下载的是汉化版

在这里插入图片描述
选择执行命令行出现的app.exe文件
在这里插入图片描述
除去node-modules、app、app.nw、nw.exe、dist、之外,所有的文件夹全部拖过去
在这里插入图片描述
到此已经打包成功了,在目录里面已经生成了一个app_boxed.exe,无论拖到哪都能顺利打开啦

  • 0
    点赞
  • 1
    收藏
    觉得还不错? 一键收藏
  • 0
    评论
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值