react-electron 項目打包體積盡可能減小的方法


 

當一個react-electron項目做好之后就可以開始進行打包,首先就是打包react,這個自然不用多說,不過事先要記住一點,項目目錄主進程文件main.js最好放在根目錄,再執行打包命令

npm run build

  這個時候目錄結構應該是這樣

這個時候需要強調的是,react項目已經打包完成,這個時候完全可以只靠main.js主進程文件和build文件夾就可以運行起來我們的項目,換句話說,剩下的文件與打包electron沒有任何關系,甚至可以直接刪除,但是畢竟是項目源代碼,肯定是不建議刪的,此時可以隨便新建一個文件夾,將main.js文件和build文件夾拷貝過去,package.json最好也復制過去

然后此時的package.json文件里面的dependencies肯定留有大量在開發過程中保留的依賴,這就是打包之后體積巨大的一個主要原因。解決方法很粗暴,直接刪除這一項里面的數據,變成這樣

"devDependencies”里面也刪掉

這個時候在新文件夾一次在安裝一次和electron有關,你在main.js主進程里才用得到的依賴(這步很重要,其實說白了就像是在一個新文件夾初始化一個electron項目一樣)

npm install electron -dev-save
npm install electron-store -dev-save
....

  然后安裝打包工具

npm install electron-packager -dev-save-g

  然后開始打包,注意:打包時候控制台一定要以管理員身份運行,不然會報錯

electron-packager ./ HHH--win32 --out   --electron-version 5.0.4" 

  解釋一下這條命令:

./   你的項目所在目錄(注意是這個新文件夾,而不是你的那個react-electron完整項目文件夾,弄錯前功盡棄)

HHH 生成的程序包名稱

--win32 打包的平台

其余的都是些可選配置,詳細的可以去看electron-packager官方

然后就打包完成,此時打包出來的文件夾只有150M左右,再使用相關打包軟件制作成exe安裝包,體積有望壓縮到100M以內


免責聲明!

本站轉載的文章為個人學習借鑒使用,本站對版權不負任何法律責任。如果侵犯了您的隱私權益,請聯系本站郵箱yoyou2525@163.com刪除。



 
粵ICP備18138465號   © 2018-2025 CODEPRJ.COM