node-webkit实践－一键安装

yy736044583 发布于2019-08-01 14:44 / 1306人阅读

摘要：博客原文地址实践一键安装前言很久以前我简单的写过关于的使用但是我在更换博客的时候丢弃了，我在下面的文章把它引用一遍。

博客原文地址node-webkit实践－一键安装

前言

很久以前我简单的写过关于node-webkit的使用,但是我在更换博客的时候丢弃了，我在下面的文章把它引用一遍。
node-webkit其实在很多地方用处很大，请自行发散。
本文的相关代码：点击查看demo的代码

本文会根据以前的文章进行实践，同样会变更一些地方。主要从以下几个方法介绍：

获取node-webkit

以我的博客为例制作一个客户端。

windows下打包一个一键安装包

引用

最近开发艾联的商家管理web后台，由于后台的效果采用了html5，为了照顾到所有低版本浏览器的商家，开始了无休止的兼容性调试，但是最终还是没有达到预期。

为了提供更好的体验，决定采用pc客户端的形势展示商家管理后台。
查了一下资料，发现有两款基于node的客户端打包工具
appjs：https://github.com/appjs/appjs
node-webkit: https://github.com/rogerwang/node-webkit
因为先看到的是node-webkit所以就采用了这种方式
作用：将web转化成原生桌面的应用（win，linux，mac）
步骤：
1. 制作web页面
2. 打包文件，参考如何打包你的app
3. win下可以通过Inno等软件制作安装包
问题：
4. 64位运行：因为自己傻，一开始没看懂api，后来看懂了，直接把包放到目录下运行就好了
5. 软件更新：这是我没有解决的地方，因为没办法直接去修改打包的内容，所以没办法去更新。我只好退而求其次，直接把

我的地址放在了配置文件中。这样我就不用担心软件的更新了

最终的windows版就直接可以打包成了安装包。由于属于公司产品，所以没有办法开放我的源码，请见谅。

获取node-webkit

git地址

很好的中文手册&教程

实际例子

大家现在浏览的是我的博客，我们以这个博客为例子，分别进行封装。因为我的博客做过自适应，所以我们自己来把它变成一个小型的桌面应用。

下载node-webkit 32位
这里可以很好的下载各种版本的。我下载32位的。

解压配置
解压你下载的文件包，在里面新建一个文件夹，我命名为我的博客名称“cindy”

添加配置文件package.json
我的配置文件很简单，因为我是远程加载的。

    {% highlight json %}
    {
      "main": "http://cindyfn.com",

      "name": "cindy-blog",

      "description": "会写ios的前端",

      "version": "0.1.0",

      "keywords": [ "web","IOS","nodejs","javascript","js","object-c","前端开发","ios开发" ],

      //定义windows表现
        "window": {

        "title": "cindy的博客",

        "icon": "logo.png",

        "toolbar": false,

        "frame": true,

        "width": 320,

        "height": 500

        }
    }
    {% endhighlight %}

打包运行

备：windows下运行可以将cindy文件夹拖拽到nw.exe中进行展示

打包：在windows下打包cindy文件夹下文件为cindy.zip打包，并修改名字为cindy.nw
打包exe: copy /b nw.exe+cindy.nw cindy.exe

这样就会在文件夹下又一个cindy.exe，点击运行就会看到相应的效果。

不过。你不要以为这样就大功告成了，你尝试把cindy.exe多带带拿出来运行，貌似不能运行了。为什么？以为它的运行是依赖包内的chrome的，你多带带拿出来当然不能运行了。不过别急，继续往下面看，教你如何打包安装包。

切换到windows电脑。有点不习惯。

windows下封装

趣：由于我目前用的是mac，没有win系统，所以把我尘封已久的电脑拿出来了，画质不好不要怪我。

node-webkit官方建议使用的封装软件是Inno,点击查看详情
具体的使用方式可以参考这里如何封装EXE安装程序

我已经按照这个步骤封装了我的博客exe，参见这里cindysetup.exe

说在后面

本文是针对windows进行封装，你也可以尝试使用mac，linux下的封装。希望你能够分享下。

云服务器 GPU云服务器一键安装一键安装包安装lnmp一键安装包 linux一键安装

文章版权归作者所有，未经允许请勿转载,若此文章存在违规行为，您可以联系管理员删除。

转载请注明本文地址：https://www.ucloud.cn/yun/49557.html

分享一个用vue2 + node-webkit + koa2 + mongodb开发的，可以实时编辑

摘要：若用户已登录，数据存储在远程服务器用户未登录时，数据存储在。开发服务端部署服务端已经部署在我自己的服务器上，不需要你进行部署啦。有什么好的建议也可以提哈记事本 showImg(https://segmentfault.com/img/remote/1460000013228992?w=50&h=50); 该项目分为两部分：桌面客户端(node-webkit) + 服务端(koa2)...

LeoHsiun 2019-08-26 11:38 评论0 收藏0
NW.js+Enigma Virtual Box+node-webkit打包Hybrid桌面应用其实

摘要：在很多原因下，我们为了迎合客户或者其他的原因，需要在本身代码或框架不能兼容的浏览器下运行项目，怎么办呢，我们将其打包为桌面应用不失为一种好。如果图标有变化，大功告成我的没有换图标，所以依然是的图标 WHY 在很多原因下，我们为了迎合客户或者其他的原因，需要在本身代码或框架不能兼容的浏览器下运行项目，怎么办呢，我们将其打包为桌面应用不失为一种好idea。nw.js是node-webkit...

microcosm1994 2019-08-20 17:31 评论0 收藏0
node-webkit文档翻译#package.json

摘要：文档翻译基本示例必填字段字符串当打开时的默认页面。可通过访问控制窗口的样子，后文细讲。禁止选中文字拖动布尔值是否在任务栏上显示。布尔值是否处于状态，在状态下将全屏并且阻止用户关闭窗口。 title: node-webkit文档翻译#package.json date: 2013-12-07 21:38:25 tags: node-webkit 基本示例 { main: i...

luodongseu 2019-08-01 14:35 评论0 收藏0
Yeoman-- 一个强大的前端构建工具

摘要：通过官方的生成器，他们建立了一个的工作流，这个流是由一个强大的固定的客户端组建，包含工具和框架帮助开发者快速建立牛逼的应用。原文还是在简书上： Yeoman-- 一个强大的前端构建工具,我只是自己的搬运工！！上期跟大家试了试Vue-cli这个构建工具，这个让我想起了很多其他的前端工具，其中一个就是Yeoman（上次就剧透了的）,所以这期跟大家先简单介绍下这个脚手架工具，然后慢慢一步...

宠来也 2019-08-19 17:26 评论0 收藏0