当一个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以内

react-electron 项目打包体积尽可能减小的方法的更多相关文章

  1. Java项目打包工具安装失败解决方法

    在学习Java的时候我们打包项目但遇到例如以下情况:(提示没有找到java的执行环境! ) 网上眼下有两中的解决方式: (1)选择本地jdk环境; (2)下载Download 可是第一种选择本地老是失 ...

  2. 在IDEA中将SpringBoot项目打包成jar包的方法

    SpringBoot项目无需依赖tomcat容器(内含)就可以发布,现在将打包步骤记录一下: 1. 打包前确认项目可以正常运行,打开Project Structure 快捷键 Ctrl+Shift+A ...

  3. 基于vue脚手架的项目打包上线(发布)方法和误区

    最近要把vue脚手架开发的一个项目上线,只知道vue脚手架是基于node的服务端项目,那么只需要 npm run dev 就可以轻松启动整个项目,当我想当然的给服务器配置合适的node环境(这里也遇到 ...

  4. Android Studio将项目打包成apk

    Android Studio将项目打包成apk 第一种方法:适合自己调试用. (1)直接在项目中生成: (2)位置是在你的项目中 第二种方法:适合发布应用. (1)找到Generate Signed ...

  5. 【Java】在IDEA中将Javafx项目打包成为可运行的.jar文件

    在使用Javafx制作一个图形化界面程序的时候,我遇到了打包文件的难题. 按照网上给出的解决方案构建出来的jar文件总是没有办法运行. 以下是我最终的解决方案. 我使用的IDE是IntelliJ ID ...

  6. electron教程(四): 使用electron-builder或electron-packager将项目打包为可执行桌面程序(.exe)

    我的electron教程系列 electron教程(一): electron的安装和项目的创建 electron教程(二): http服务器, ws服务器, 子进程管理 electron教程(三): ...

  7. electron 项目的打包方式,以及 jquery 插件的修改使用

    < 一 > 应用打包 1,首先确定安装了 node 和 npm 2,全局安装打包依赖  => npm i electron-packager -g 3,打包命令 electron-p ...

  8. Electron – 基础学习(3): 项目打包成exe桌面应用 之electron-builder

    前次用 electron-packager 打包成功,这次改用 electron-builder 打包,然后根据项目中实际需要进行选择使用. 第一步:全局安装 electron-builder,便于系 ...

  9. Electron+Vue – 基础学习(2): 项目打包成exe桌面应用

    项目创建完成,启动正常,接下来就是项目打包了.将测试Demo打包成exe桌面应用,点击exe文件,运行项目. 书接上文,创建项目有三种方式 Git拷贝.直接创建:通过electron社群提供的命令行工 ...

随机推荐

  1. 洛谷P2607 骑士

    题目描述 Z国的骑士团是一个很有势力的组织,帮会中汇聚了来自各地的精英.他们劫富济贫,惩恶扬善,受到社会各界的赞扬. 最近发生了一件可怕的事情,邪恶的Y国发动了一场针对Z国的侵略战争.战火绵延五百里, ...

  2. Inno Setup 设置开机启动

    案1: 将快捷方式添加到“启动”文件夹 [Tasks] Name: "startupicon"; Description: "{cm:CreateQuickLaunchI ...

  3. asp.net ajax客户端框架如何调用Web Service

    asp.net ajax客户端框架如何调用Web Service 1:Web Service类添加 [System.Web.Script.Services.ScriptService]特性2:需要异步 ...

  4. HDU 4193

    本题思路:用sum[]数组维护前缀和, 当然这里需要把原数组扩大为原来的两倍. 然后对于任意一个长度为n的区间 k.....k+n-1,如果有该区间内的最小值大于等于sum[k-1]那么该种情况就符合 ...

  5. XPath 获取两个node中间的HTML Nodes

    XPath 获取两个node中间的HTML Nodes 2015-06-01 16:42 972人阅读 评论(0) 收藏 举报 //div[@id="Recipe"]//h5[co ...

  6. hdu5131 贪心

    #include<stdio.h> #include<string.h> #include<algorithm> #include<string> #i ...

  7. Android 高仿微信语音聊天页面高斯模糊效果

    目前的应用市场上,使用毛玻璃效果的APP随处可见,比如用过微信语音聊天的人可以发现,语音聊天页面就使用了高斯模糊效果. 先看下效果图: 仔细观察上图,我们可以发现,背景图以用户头像为模板,对其进行了高 ...

  8. poj 2342 hdu 1520【树形dp】

    poj 2342 给出每个顶点的happy值,还有若干组两个顶点L,K关系,表示K是L的上司.求当K.L不同时出现时获得的happy值的最大和. 设dp[u][0]表示不选u结点时获得的最大值,dp[ ...

  9. Mysql 查询一天中,每个小时数据的数量

    SELECT HOUR(e.time) as Hour,count(*) as Count FROM error_log e WHERE e.date = '2017-09-02' GROUP BY ...

  10. spring的父子关系

    1.父容器不能拿子容器的资源 2.子容器可以拿到父容器的资源