由于每天日常的工作需要,我需要接觸大量的外文資料,因此,一個好用的翻譯工具必不可少。得益于 Google 在翻譯上的優(yōu)秀表現(xiàn),將它作為我的主要翻譯工具使用也是無可爭議。但是在使用中經(jīng)常會發(fā)現(xiàn),web 端的頁面總是會在不經(jīng)意間被手滑關掉,要用的時候找了一會才發(fā)現(xiàn)需要重新打開。
此外,想要在工作時間更好地進行「摸魚」,用電腦肯定會比用手機更安全。
有了這兩個需求,我尋找了數(shù)款能夠?qū)?Web 轉(zhuǎn)換成 Mac app 的工具,但在體驗之后都發(fā)現(xiàn)會有這樣那樣的小問題,有一些甚至無法工作或是生產(chǎn)的 app 無法打開。
直到我發(fā)現(xiàn)了它 —— nativefier。
安裝 nativefier
nativefier 是一個基于 Electron 的命令行工具,完全開源,沒有 UI 界面,且無需安裝任何 app,只需要通過一行簡單的代碼,就可以輕松地將任何 Web 頁面打包成可以在桌面運行的 app,并且支持在Windows,Mac 甚至是 Linux 系統(tǒng)上運行。
P.S. 作者是一位在 Google 工作的軟件工程師,似乎是一位華人。
目前,nativefier 在 Github 上已經(jīng)獲得了 2.14 萬個 Star。
使用 nativefier 的過程非常簡單,但需要提前準備一些東西。這里我以 macOS 作為演示,其它平臺大同小異,可以參考網(wǎng)上的其它教程。
首先,我們需要安裝 Node.js。你可以通過到 Node.js 的官方網(wǎng)站下載之后進行安裝,但我這里更推薦使用 Homebrew,這樣就可以在一個終端 app 里搞定全部的事情。
如果你還沒有安裝 Homebrew,可以通過下面這一條命令在終端進行安裝。
/usr/bin/ruby -e "$(curl -fsSL https://raw.githubusercontent.com/Homebrew/install/master/install)"
更多關于 Homebrew 的使用,可以參考這篇文章。
安裝好 Homebrew,就可以安裝 Node.js 了。在終端內(nèi)輸入:
brew install node
如果因為某些網(wǎng)絡原因安裝緩慢,可以試試換成國內(nèi)的鏡像源。跑完進度后,可以在終端中輸入 node -v 和 npm -v,測試一下版本,出現(xiàn)版本號即說明安裝成功。
有了 Node.js,我們就可以來安裝 nativefier 本體了。同樣是在終端,輸入下面的命令:
npm install nativefier -g
如果提示權限不足,可以試試在前面加上 sudo:
sudo npm install nativefier -g
搞定。接下來,我們就用 nativefier 來制作一個 app。
使用
最簡單的使用方法,只需要用 nativefier 加上一個你需要轉(zhuǎn)換成的網(wǎng)站地址就可以了。例如:
nativefier "https://www.sspai.com"
第一次運行會下載 Eletron 框架,可能會慢一些。
命令執(zhí)行完畢后,會生成一個大小在 120 – 150M 左右的,名為「 —darwin-x64」的文件夾。如果你沒有更改運行地址,那么會默認出現(xiàn)在你的個人文件夾中。
點擊進入文件夾內(nèi),就能看到剛剛制作好的 app 了。將這個 app 拖入到應用程序文件夾中,它就會出現(xiàn)在 Lanchpad 里。
一個網(wǎng)頁打包的少數(shù)派 for Mac app 就做好了。
上面的這個方法,會自動抓取網(wǎng)站的名字和 Logo 來作為名稱及 app 圖標。但有時,nativefier 也會「翻車」(比如上面 app 名字顯示成了「–」),這時候就需要我們自定義 app 的名稱??梢杂孟旅孢@條命令:
nativefier –name "在這里輸入 app 名字" "http://www.sspai.com"
注意,這個 app 名字不支持中文。如果你想要更改中文的 app 名稱,可以在 nativefier 制作好的 app 上直接更改,再拖入到應用程序文件夾中。
不過,nativefier 有個小瑕疵:由于有些網(wǎng)站的圖標或 logo 形狀不好看,又或者太丑、分辨率太低,導致有些時候生成的 app 圖標無法令人滿意。
這個問題其實也有解決辦法。nativefier 提供了一個 –icon 的參數(shù),只要我們準備一張 png 格式的圖片,就可以應用成圖標了。
如果你不太明白上面在說什么,你也可以手動進行替換。提前準備好一個 icns 格式的圖標,并命名為「electron.icns」,然后在生成好的 app 上右鍵點擊「查看包內(nèi)容」,進入「Contents – Resources」,將我們準備好的圖標放到里面替換原來的圖標即可。
例如,我這里就用 Sketch 為 Tinde 和小特畫了一個和 macOS Catalina 原生風格類似的高清圖標 ,然后再用 Image2icon 轉(zhuǎn)換成 icns 格式,替換之后,就沒有這么強烈的「像素風」了,違和感也降低了不少。
這個頁面里有 4 個 app 都是用 nativefier 生成的
除了這些之外,nativefier 還提供了很多可供選擇的參數(shù),例如是否要限制 app 窗口的寬高、是否顯示菜單欄、、是否在關閉時推出、是否開啟 flash 支持等等,你可以在終端直接輸入 nativefier 或 nativefier -h 來查看,或者是閱讀官方的 API 文檔 來學習。
哦對了,nativefier 制作的 app,甚至還支持調(diào)用系統(tǒng)的推送。例如將微信網(wǎng)頁版打包成 app 之后,有新消息來時,一樣也能夠收到新消息通知。
好了,nativefier 就給大家介紹到這里,我要用剛打包好的 app 去摸魚了。
版權聲明:本文內(nèi)容由互聯(lián)網(wǎng)用戶自發(fā)貢獻,該文觀點僅代表作者本人。本站僅提供信息存儲空間服務,不擁有所有權,不承擔相關法律責任。如發(fā)現(xiàn)本站有涉嫌抄襲侵權/違法違規(guī)的內(nèi)容, 請發(fā)送郵件至 舉報,一經(jīng)查實,本站將立刻刪除。