今天在無意間發現了一個新的前端平臺框架 Tauri
據說對比electron有許多性能和打包大小等等方面的優化,具體可看github link
由于在環境安裝中遇到了坑,這里將官網macOS的安裝流程記錄下來,并且在相關地方標注注意事項:
1. System Dependencies
`brew install gcc` 安裝gcc環境
這里安裝gcc的時候博主出現了一些問題,由于`brew cleanup has not been run in 30 days, running now.`
提示,在使用brew安裝的時候自動運行,結果與博主之前安裝在系統中的hexo沖突,而博主也不想進行任何修改,
這里就可以在gcc安裝之前先運行一下`brew cleanup`,之后就正常了。
`xcode-select --install` 安裝xcode命令行插件
2. Node.js
官方推薦nvm進行相關安裝,相關教程可以去這里看NVM。直接nvm install node --latest-npm
安裝node最新版即可,這里略去不講
3. Rustc and Cargo
`curl --proto '=https' --tlsv1.2 -sSf https://sh.rustup.rs | sh`
可以使用`rustc --version`命令查看是否安裝完成。
如果已經有Rustc則使用`rustup update stable`命令進行版本的更新。
4. Tauri Bundler
`cargo install tauri-bundler --force`進行Tauri Bundler安裝。
這里提醒下,在Rustc和Cargo環境安裝的時候執行source $HOME/.cargo/env
就不用重新啟動命令行了,博主本人mac系統,用戶目錄下的.bash_profile
文件中的$HOME/.cargo/bin:$PATH
已經被自動加入了。
接下來就是Tauri的安裝和配置了。
Tauri的安裝和配置
不知道是不是因為博主的mac系統還停留在Mojave 10.14.1版本的緣故,下面的步驟出現了一些很奇怪的問題,這里跟著流程走,進行一一列舉:
1、官方建議使用yarn add tauri
或者npm install tauri --save
命令進行tauri的本地安裝。(如果在安裝tauri的時候出現問題,可以檢查一下npm的版本和yarn的版本,是否符合需求,npm至少要12以上)
在這里可能存在的一個坑:安裝錯誤,提示node_modules/sharp組件不存在,但是實際上你去npm install sharp是不管用的,真正的錯誤是'vips/vips8' file not found
,這是因為缺少了libvips這個處理圖片的庫,這里提供macOS下的解決方案:brew install vips
。安裝過程中可能會出現失敗的情況(博主就碰到了qt安裝失敗),但是確實這并沒有關系,也可能是網絡原因,重新brew安裝vips就好了,友情提示本教材所有下載相關建議掛梯子。
2、安裝好后執行yarn tauri init
進行Tauri項目的初始化,yarn tauri info
查看Tauri是否正確安裝。
總算是把環境安裝好了,使用yarn tauri dev
就可以測試當前的初始項目啦。第一次運行此命令時,Rust軟件包管理器將花費幾分鐘的時間來下載并構建所有必需的軟件包。由于已將其緩存,因此后續構建將更快,因為只有Tauri組件需要重建。
現在就可以使用Tauri窗口來開發應用程序啦!
Tauri的打包
Tauri的打包也有些奇葩,不知道是不是官方尚未完善的問題,我這里的tauri-bundler的版本是0.6.1,如果是直接對上文構建的項目進行build的時候,會出現錯誤:Error: cannot find index.html in "xxxx/dist". Did you forget to build your web code or update the build.distDir in tauri.conf.json?
但是其實在tauri.conf.json文件中已經默認生成在根目錄下會創建dist目錄,這里解決方法是自己創建一個dist目錄,在里面加上index.html文件。
最終生成的app就創建在src-tauri/target/release/bundle
下,相關的可執行app文件和安裝文件都有了,可以說是一鍵生成非常方便了。在我加了簡單的helloworld顯示打包后的文件大小為5M,下面是相關圖顯示。