网站封装成app源码(把网站做成app的软件推荐)

由于每天日常的工作需要,我需要接触大量的外文资料,因此,一个好用的翻译工具必不可少。得益于 Google 在翻译上的优秀表现,将它作为我的主要翻译工具使用也是无可争议。但是在使用中经常会发现,web 端的页面总是会在不经意间被手滑关掉,要用的时候找了一会才发现需要重新打开。

此外,想要在工作时间更好地进行「摸鱼」,用电脑肯定会比用手机更安全。

有了这两个需求,我寻找了数款能够将 Web 转换成 Mac app 的工具,但在体验之后都发现会有这样那样的小问题,有一些甚至无法工作或是生产的 app 无法打开。

直到我发现了它 —— nativefier。

网站封装成app源码(把网站做成app的软件推荐)

目前,nativefier 在 Github 上已经获得了 2.14 万个 Star。

网站封装成app源码(把网站做成app的软件推荐)

如果你还没有安装 Homebrew,可以通过下面这一条命令在终端进行安装。

/usr/bin/ruby -e "$(curl -fsSL https://raw.githubusercontent.com/Homebrew/install/master/install)"

更多关于 Homebrew 的使用,可以参考这篇文章。

安装好 Homebrew,就可以安装 Node.js 了。在终端内输入:

brew install node

如果因为某些网络原因安装缓慢,可以试试换成国内的镜像源。跑完进度后,可以在终端中输入 node -v 和 npm -v,测试一下版本,出现版本号即说明安装成功。

有了 Node.js,我们就可以来安装 nativefier 本体了。同样是在终端,输入下面的命令:

npm install nativefier -g

如果提示权限不足,可以试试在前面加上 sudo:

sudo npm install nativefier -g

搞定。接下来,我们就用 nativefier 来制作一个 app。

使用

最简单的使用方法,只需要用 nativefier 加上一个你需要转换成的网站地址就可以了。例如:

nativefier "https://www.sspai.com"

第一次运行会下载 Eletron 框架,可能会慢一些。

网站封装成app源码(把网站做成app的软件推荐)

点击进入文件夹内,就能看到刚刚制作好的 app 了。将这个 app 拖入到应用程序文件夹中,它就会出现在 Lanchpad 里。

网站封装成app源码(把网站做成app的软件推荐)

上面的这个方法,会自动抓取网站的名字和 Logo 来作为名称及 app 图标。但有时,nativefier 也会「翻车」(比如上面 app 名字显示成了「–」),这时候就需要我们自定义 app 的名称。可以用下面这条命令:

nativefier --name "在这里输入 app 名字" "http://www.sspai.com"

注意,这个 app 名字不支持中文。如果你想要更改中文的 app 名称,可以在 nativefier 制作好的 app 上直接更改,再拖入到应用程序文件夹中。

不过,nativefier 有个小瑕疵:由于有些网站的图标或 logo 形状不好看,又或者太丑、分辨率太低,导致有些时候生成的 app 图标无法令人满意。

网站封装成app源码(把网站做成app的软件推荐)

例如,我这里就用 Sketch 为 Tinde 和小特画了一个和 macOS Catalina 原生风格类似的高清图标 ,然后再用 Image2icon 转换成 icns 格式,替换之后,就没有这么强烈的「像素风」了,违和感也降低了不少。

网站封装成app源码(把网站做成app的软件推荐)

这个页面里有 4 个 app 都是用 nativefier 生成的

除了这些之外,nativefier 还提供了很多可供选择的参数,例如是否要限制 app 窗口的宽高、是否显示菜单栏、、是否在关闭时推出、是否开启 flash 支持等等,你可以在终端直接输入 nativefier 或 nativefier -h 来查看,或者是阅读官方的 API 文档 来学习。

哦对了,nativefier 制作的 app,甚至还支持调用系统的推送。例如将微信网页版打包成 app 之后,有新消息来时,一样也能够收到新消息通知。

好了,nativefier 就给大家介绍到这里,我要用刚打包好的 app 去摸鱼了。

(0)
小多多的头像小多多创始人

相关推荐

发表回复

登录后才能评论