當一個react-electron項目作好以後就能夠開始進行打包,首先就是打包react,這個天然不用多說,不過事先要記住一點,項目目錄主進程文件main.js最好放在根目錄,再執行打包命令javascript
npm run build
這個時候目錄結構應該是這樣java
這個時候須要強調的是,react項目已經打包完成,這個時候徹底能夠只靠main.js主進程文件和build文件夾就能夠運行起來咱們的項目,換句話說,剩下的文件與打包electron沒有任何關係,甚至能夠直接刪除,可是畢竟是項目源代碼,確定是不建議刪的,此時能夠隨便新建一個文件夾,將main.js文件和build文件夾拷貝過去,package.json最好也複製過去react
而後此時的package.json文件裏面的dependencies確定留有大量在開發過程當中保留的依賴,這就是打包以後體積巨大的一個主要緣由。解決方法很粗暴,直接刪除這一項裏面的數據,變成這樣npm
"devDependencies」裏面也刪掉json
這個時候在新文件夾一次在安裝一次和electron有關,你在main.js主進程裏才用獲得的依賴(這步很重要,其實說白了就像是在一個新文件夾初始化一個electron項目同樣)electron
npm install electron -dev-save npm install electron-store -dev-save ....
而後安裝打包工具工具
npm install electron-packager -dev-save-g
而後開始打包,注意:打包時候控制檯必定要以管理員身份運行,否則會報錯ui
electron-packager ./ HHH--win32 --out --electron-version 5.0.4"
解釋一下這條命令:code
./ 你的項目所在目錄(注意是這個新文件夾,而不是你的那個react-electron完整項目文件夾,弄錯前功盡棄)blog
HHH 生成的程序包名稱
--win32 打包的平臺
其他的都是些可選配置,詳細的能夠去看electron-packager官方
而後就打包完成,此時打包出來的文件夾只有150M左右,再使用相關打包軟件製做成exe安裝包,體積有望壓縮到100M之內