【Electron】在 WSL2 中 打包 electron Linux 版本。
安裝 WSL
我使用的是 Ubuntu 20.04.4 LTS 的版本。
安裝 WSL 文檔地址:https://docs.microsoft.com/zh-cn/windows/wsl/install。
如果你的系統是 Windows 11,內部版本是 22000 或更高,你也可以試試 還 GUI 的 WSL。
https://docs.microsoft.com/zh-cn/windows/wsl/tutorials/gui-apps
也可以自行百度,這裏就不多述了。
安裝 NVM
我選擇先安裝 nvm 的方式來安裝 Node 環境,比較容易管理,也方便有需要的時候切換各種版本。
通過下面的腳本安裝
curl -o- https://raw.githubusercontent.com/nvm-sh/nvm/v0.39.1/install.sh | bash
可以從 nvm 的 github 上找到最新的命令,https://github.com/nvm-sh/nvm
安裝 Node 環境
使用 nvm 的命令 安裝 node 環境
nvm install 14.*.*
nvm use 14
# PS 如果 npm 執行到的目錄不對,可能執行到了 windows 中環境的目錄
# 可以再執行 nvm use xx 來臨時解決
獲取代碼
在我裏這用的是我自己的架子,全當一個參考吧。
github:https://github.com/gaoshang212/electron-vite-react-typescript
git clone https://github.com/gaoshang212/electron-vite-react-typescript
安裝 vscode 插件 Remote - WSL
爲了方便在 vscode 中直接修改操作 wsl 中的文件。
我使用 Remote - WSL 這個插件,可以直接在vscode 修改代碼,執行命令行。
插件地址:https://marketplace.visualstudio.com/items?itemName=ms-vscode-remote.remote-wsl
安裝好插件,我們就可以在 wsl 中直接執行 code . 來打包 vscode 操作了
打包
我這裏只打包了 deb 和 appImage 的包,用的打包模塊是 electron-builder 。
直接執行下面的命令來打包
npm run package
PS:如果打包 deb 報錯,可以設置一個下 export DEBUG=”electron-builder”,查一下輸出。
我裏碰到的是 缺少 “ar”,只要通過 sudo apt install binutils 安裝一下,就 OK 了。
打包結果: