非技术人员可以使用 Github 的 Electron 在 Mac 上构建特定于站点的浏览器的最简单方法是啥？

Posted 2023-03-07

【中文标题】非技术人员可以使用 Github 的 Electron 在 Mac 上构建特定于站点的浏览器的最简单方法是啥？

【英文标题】：What is the easiest way a non-technical person can build a site-specific browser on a Mac using Github's Electron?非技术人员可以使用 Github 的 Electron 在 Mac 上构建特定于站点的浏览器的最简单方法是什么？

【发布时间】：2015-09-12 12:49:35

【问题描述】：

我希望能够将 Trello、Facebook、Facebook Messenger、Asana、WhatsApp Web 等网站作为桌面应用程序打开。我目前使用 Fluid (http://fluidapp.com/)，但我想看看是否可以使用 Electron 来做同样的事情。

假设我全新安装了 Mac OS X 10.10，我想我需要：

安装 npm (https://www.npmjs.com/)。 我应该安装 io.js 还是 node？我不知道它会有什么不同。 可以不安装npm吗？无论如何，这似乎很简单：下载并安装https://nodejs.org/dist/latest/node-v4.0.0.pkg

安装 Electron (http://electron.atom.io/)。这看起来很简单（虽然我不太确定这是否是 Nativefier 的先决条件）：

npm install electron-prebuilt -g

安装 Naivefier (https://www.npmjs.com/package/nativefier)。这似乎也很简单：

npm install nativefier -g 

按照 Naivefier 的说明进行操作（以 Facebook Messenger 为例）：

nativefier Messenger http://messenger.com --platform=darwin --arch=x64 --version=0.29.1 --overwrite --badge

这是我能找到的最简单的方法。还有其他建议吗？ 或者，是否有更好但更复杂的方法？

老实说，答案可能需要简化一些......我不是一个技术人员。

【参考方案1】：

构建一个电子应用程序非常简单。如果您只想在您的机器上运行该应用程序，则无需打包文件。如果您想将该应用程序发送给您的朋友，您需要打包他们： http://electron.atom.io/docs/v0.32.0/tutorial/application-distribution/

要创建这样的应用程序，我会推荐 yeoman (http://yeoman.io/)。

安装node.js (https://docs.npmjs.com/getting-started/installing-node)，因为需要用到npm 通过 npm 安装 yeaoman：http://yeoman.io/ 通过 npm 安装电子样板：https://github.com/sindresorhus/generator-electron 为您的应用创建一个文件夹 使用终端并转到文件夹应用程序。键入“yo”并选择电子发生器。整个项目由yeoman安装

yeoman 完成后。打开文件 index.js 并寻找一行

win.loadUrl(file://$__dirname/index.html);

将网址更改为您的网站。

现在，当您打开应用程序时，应该会加载 url。我知道有更好的方法，但我认为这应该是最简单的方法，因为你没有太多编程经验。

【讨论】：

嗯... Nativefier 方法似乎与我相似。我会让约曼试一试，看看情况如何。为了回答你的问题，我确实更喜欢将它打包为一个应用程序，这样我就可以为不同的网站选择图标，并能够使用 Alfred (alfredapp.com) 启动它们。谢谢！

我还可以问一下更好的方法吗？我并不反对花时间学习和理解新事物。如果您有时间，请随时发布一般路线或将我指向相关网站！

【参考方案2】：

https://webcatalog.io 是一个开源应用程序，它提供了一个 GUI 来执行与 nativefier 相同的操作，而无需手动安装许多不同的包。