我们在上一篇文章中用vue-cli创建了一个的项目,并且使用nw 打开某个链接,这次我们讲述如何使用nw打包一个vue-cli创建的项目。
进入vue项目后,我们可以使用npm run dev 打开8080端口访问页面,在使用nw打包之前,我们先需要build以下项目,执行npm run build就可以了。
build完后,会在当前目录下生成dist 文件夹,进入dist文件夹,目录结构如下.
+dist
-static
-index.html
此时我们在dist文件夹创建一个package.json 文件,内容如下
{
"name":"test1",
"main": "./index.html",
"version":"1.0.0",
"window": {
"width": 1024,
"height": 768,
"frame": true,
"toolbar": false,
"icon": "static/icon.png"
}
}
以上的信息是nw/nwbuild 命令必须要的参数。其他参数可以查看此处http://docs.nwjs.io/en/latest/References/Manifest%20Format/
nwbuild可以使用npm install nwbuild -g 进行全局安装。
创建了以上文件后,在当前目录执行以下命令
nwbuild --platforms osx64
platforms 参数有win32,win64,osx64,linux32,linux64
执行完后,在当前目录下生成了build文件夹,里面就是已经打包好项目的nw程序,运行就能打开了。