nwjs 启动打包好的vue项目

nwjs 如何启动一个打包好的vue 项目

1. 下载 nwjs
   nwjs.io/ 官网下载 一般情况下 官网下载会比较的慢 这个时候我们直接用淘宝 镜像直接下载 npm.taobao.org/mirrors/nwj… 当然版本随我们挑选 这里我选择v0.41.1

2. 加入索引
   这里我用的mac电脑

1  解压 cd到文件夹目录
2  cp -r ./nwjs.app /Applications/  复制文件到Applications
3 设置 alias
vi ~/.bash_profile     // insert
alias nw="/Applications/nwjs.app/Contents/MacOS/nwjs" //放到文件里面
:wq! //  退出并保存
 source ~/.bash_profile //执行一下
4 在当前目录运行nwjs  就会启动一个界面出现nwjs  说明安装成功

3. 打包你的vue 项目 npm run build 生成dist 文件夹

vue  项目打包  npm run build

4. 运行

在dist  文件夹建议package.json
{
  "name":"tehe",
  "main": "index.html",
  "version":"1.0.0",
  "window": {
      "width": 1000,
      "height": 750,
      "frame": true,
      "toolbar": false,
  }
}
 可根据 nwjs  配置继续  添加  
在 上面运行nw 的目录  访问   /Users/tehe/QMS-front-admin/dist/
nw   /Users/tehe/QMS-front-admin/dist/
这样你就可以访问到你的vue  桌面应用了

nwjs 打包一个应用

上面讲了我们如何启动一个项目 现在我们来讲下 如何打包这个应用 打包

全局安装 nw-builder 
npm install nw -g (可选)
npm install nw-builder -g

配置
Usage: nwbuild [options] [path]
 
Options:
  -p, --platforms      Platforms to build, comma-sperated, can be: win32,win64,osx32,osx64,linux32,linux64   ['osx64', 'win32', 'win64']
  -v, --version        The nw version, eg. 0.8.4                                             [default: "latest"]
  -r, --run            Runs NW.js for the current platform                                   [default: false]
  -o, --buildDir       The build folder                                                      [default: "./build"]
  -f, --forceDownload  Force download of NW.js                                               [default: false]
  --cacheDir           The cache folder
  --quiet              Disables logging    

nwbuild -p osx64 /Users/tehe/QMS-front-admin/dist   

我打的macos 的包  大家根配置自行打包

www.npmjs.com/package/nw-…

学习交流群 qq 群 112496338