Matrix 精选

Matrix 是少数派的写作社区，我们主张分享真实的产品体验，有实用价值的经验与思考。我们会不定期挑选 Matrix 最优质的文章，展示来自用户的最真实的体验和观点。

文章代表作者个人观点，少数派仅对标题和排版略作修改。

---

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

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

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

直到我发现了它 —— nativefier 。

安装 nativefier

nativefier 是一个基于 Electron 的命令行工具，完全开源，没有 UI 界面，且无需安装任何 app，只需要通过一行简单的代码，就可以轻松地将任何 Web 页面打包成可以在桌面运行的 app，并且支持在Windows，Mac 甚至是 Linux 系统上运行。

P.S. 作者是一位在 Google 工作的软件工程师，似乎是一位华人。

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

使用 nativefier 的过程非常简单，但需要提前准备一些东西。这里我以 macOS 作为演示，其它平台大同小异，可以参考网上的其它教程。

首先，我们需要安装 Node.js。你可以通过到 Node.js 的官方网站下载之后进行安装，但我这里更推荐使用 Homebrew，这样就可以在一个终端 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 框架，可能会慢一些。

命令执行完毕后，会生成一个大小在 120 - 150M 左右的，名为「 ---darwin-x64」的文件夹。如果你没有更改运行地址，那么会默认出现在你的个人文件夹中。

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

一个网页打包的少数派 for Mac app 就做好了。🌝

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

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

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

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

这个问题其实也有解决办法。nativefier 提供了一个 --icon 的参数，只要我们准备一张 png 格式的图片，就可以应用成图标了。

如果你不太明白上面在说什么，你也可以手动进行替换。提前准备好一个 icns 格式的图标，并命名为「electron.icns」，然后在生成好的 app 上右键点击「查看包内容」，进入「Contents - Resources」，将我们准备好的图标放到里面替换原来的图标即可。

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

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

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

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

> 下载少数派 客户端 、关注 少数派公众号 ，找到数字时代更好的生活方式 🎊

> 特惠、好用的硬件产品，尽在 少数派 sspai 官方店铺 🛒