将网站转换为应用

将网站转换为本地应用程序（无论是在移动设备还是台式机上）都非常有用。书签的问题特别是对于软件工程师而言，是我们经常需要在不同的浏览器中工作，因此在一个浏览器的书签集中设置所有内容可能会很麻烦。我也认为具有特定用途区域的网站是将网站转换为桌面应用程序的绝佳案例。我最近发现了nativefier，这是一个开放源代码实用程序，它通过将网站包装在Electron中来创建本地桌面应用程序。

安装

您可以使用NPM安装nativefier和node-icns，我们将使用它们来为应用创建自定义图标：

npm install -g nativefier # App creator
npm install -g node-icns  # Icon creator

nativefier文档提供了一种用于创建桌面应用程序图标的方法，但是需要ImageMagick和iconutils-node-icns可以减轻您的痛苦。

创建应用程序图标

在创建应用程序本身之前创建应用程序图标很重要。您可以创建带有节点图标和所选图像的应用程序图标：

# Generate icon set required by macOS
nicns --in app-icon.png --out app-icon.icns

使用高质量的方形PNG-将保留透明度，并且文件大小无关紧要，因为文件将保留在您的计算机上。

创建应用

nativefier提供了许多配置参数，可用于创建应用程序。让我们使用许多有用的参数创建一个应用程序：

nativefier 
    --name "David Walsh Blog" 
    --verbose 
    --counter 
    --icon app-icons.icns 
    --fast-quit 
    --inject custom-css.css 
    --inject custom-js.js 
    --flash # gross
    "https://davidwalsh.name"

将生成一个名为“ {appname} -darwin-x64”的目录，该目录中将包含应用程序文件，您可以将其拖动到Applications 文件夹（或任何等效于OS的文件夹）和扩展坞中。您会注意到，您可以添加自定义用户JavaScript和CSS文件，以便隐藏广告，修改颜色和行为等。本-counter argument特别有意思-如Gmail的Web App更新其<title> 标记为伪通知将触发一个红色通知点在应用程序图标，当某一更新。

像IRCCloud这样的Web应用程序和像DevDocs这样的网站都是转换为桌面应用程序的理想选择。