5分钟把任意网站变成桌面软件

84

以前,开发一个桌面软件要花费大量的人力和时间。现在,随着web技术的快速发展,很多业务逻辑已经在网站上实现。既然如此,能不能把网站快速转变成软件呢?这方面的实践已经有很多,早期的Qt,后来的Electron,都可以实现跨平台桌面软件的开发。不就是内嵌一个浏览器么?能不能快一些?再快一些?今天,给大家介绍一个工具,让你5分钟之内就把一个网站变成一个可安装的桌面软件。

制作软件

让我们以https://segmentfaut.com这个网站为例来制作我们的软件。

安装工具

一句话搞定:

npm i -g nativefier

开始制作

一句话搞定:

nativefier "https://segmentfault.com"

运行软件

好了,软件制作好了,看看效果吧:

图片描述

就是这么简单,有没有?

可选步骤

以上是必经步骤,以下是可选步骤。

作人不可过于懒惰,进门之后,多多少少还是需要调整一下的。Nativefier提供了很多选项可供设置,包括应用软件名称、图标、初始窗口尺寸、是否全屏等等等等,具体可以到官网查询。

同时,在设置好这些选项之后,为了便于以后调整和使用,最好是做一个批处理脚本:

#!/bin/bash

nativefier --name "SegmentFault" "https://segmentfault.com/"

调整完参数之后,重新运行这个脚本就可以了。

制作安装包

制作完软件之后,我们得到是一个名为SegmentFault.app的应用程序,虽然已经可以执行了,但看上去不够专业,专业的安装包都是.dmg为后缀的文件,接下来我们就来制作一个.dmg

打开Mac自带的磁盘工具,新建一个空白映像

图片描述

初始时的大小设置为200MB,因为缺省的100MB放不下安装文件,但是这个尺寸后面可以压缩,所以即使设置为300MB也没关系的。

clipboard.png

建好之后,双击图标打开这个文件,把刚才上面做好的SegmentFault.app拷贝进去,然后再在里面建立一个指向Applications文件夹的快捷方式,右键菜单点击显示选项,勾选『始终以图标显示方式打开』,调整图标大小,在最下面挑选一张带箭头的图片作为背景。

clipboard.png

最后,再次打开磁盘工具,先推出刚才的这个文件,然后点击菜单『映像』-『转换』,把它压缩一下,一个完美的dmg安装包就制作好了。

clipboard.png

新的安装包大小大约是51MB,我把它上传到百度网盘了,有需要的同学可以下载安装试用一下。Windows的安装包我就不制作了,制作软件方法类似,只是在制作安装包的时候,Windows要稍微麻烦一些。

怎么样,制作一个桌面软件是不是很容易呢?你也来学着把贵司的网站变成软件吧!


如果觉得我的文章对你有用,请随意赞赏

你可能感兴趣的

35 条评论
hwaphon · 2018年01月22日

还不如将该网站地址快捷方式保存在桌面

+21 回复

kumfo · 2018年01月23日

世界上最不缺少闲的蛋疼的人,只有闲的蛋疼的人才会想出各种办法搞事情,只有多搞事情才能走在通往大牛的路上。

+7 回复

mengdu · 2018年01月22日

打包大可不必这么麻烦,我编写过个专门为web app使用的浏览器,也是基于electron的,只要改下主页网址即可
项目地址:https://github.com/mengdu/vue...
欢迎star
截图

+6 回复

認真你就輸了 · 2018年01月22日

有时间,整个Windows版的呗。谢谢咯

+4 回复

0

可以看一下这个两行命令就可以https://mr-houzi.github.io/20...

Mr_houzi · 2018年01月24日
元2014 · 2018年01月24日

没有windows

+2 回复

0
Mr_houzi · 2018年01月24日
yelfive · 2018年01月22日

其实就是chrome 快捷方式,百度chrome --app

+1 回复

陌上寒 · 2018年01月22日

Windows的来一个

+1 回复

0

Windows可以参考一下这个 https://mr-houzi.github.io/20...

Mr_houzi · 2018年01月24日
yuanfan · 2018年01月22日

现在不是C端的趋势?反过来向B端封装了啊

+1 回复

anh6 · 2018年01月22日

其实就是打包了Electron。

nativefier "https://segmentfault.com" 运行结果:Packaging app for platform win32 x64 using electron v1.7.9

nativefier介绍:
Nativefier is a command line tool that allows you to easily create a desktop application for any web site with succinct and minimal configuration.
** Apps are wrapped by Electron in an OS executable (.app, .exe, etc.) for use on Windows, macOS and Linux.

+1 回复

sino · 2018年01月22日

意义呢。。

+1 回复

LittleCat · 2018年01月22日

可以拉取控件么,没联网的话资源显示如何?

+1 回复

fish · 2018年01月23日

蛮有意思的

+1 回复

不热 · 2018年01月26日

希望我也能像先生你一样,沉下心搞技术。让别人说去吧。

+1 回复

1

@StephenTvT 人生苦短,不要争论。

张京 作者 · 2018年01月26日
LiLiKiLL · 2018年01月22日

还有这种操作

回复

sulishibaobei · 2018年01月22日

这个只能打包国内的网站吗?

回复

chenging · 2018年01月22日

用nw更方便,下载nw软件包,在里面package.json找到文件,将main配置为网页,然后设置下宽高,保存下就搞定了。启动的时候打开nw.exe文件。

回复

mengzyou · 2018年01月22日

Linux上呢?可以用吗?

回复

点号 · 2018年01月22日

来个Windows

回复

伽蓝夜雨丶 · 2018年01月22日

感觉就像个webview,根本没看出有多大的实用价值

回复

0

基本上就是一层webview 包裹着

Lomo · 2018年01月24日
王瑞芳 · 2018年01月22日

windows,

回复

1

Windows可以参考一下这个 https://mr-houzi.github.io/20...

Mr_houzi · 2018年01月24日
载入中...