1.使用 JavaScript, HTML 和 CSS 构建跨平台的桌面应用

2.下载https://github.com/electron/electron-quick-start中的示例

3.在示例目录下本地安装electron、以及electron-packager

npm install electron --save-dev
npm install electron-packager --save-dev

4.修改package.json文件:

{
"name": "electron-quick-start",
"version": "1.0.0",
"description": "A minimal Electron application",
"main": "main.js",
"scripts": {
"start": "electron .",
"package": "electron-packager ./ --win --out ./OutApp --arch=x64 --electron-version=1.8.2 --asar"
},
"repository": "https://github.com/electron/electron-quick-start",
"keywords": [
"Electron",
"quick",
"start",
"tutorial",
"demo"
],
"author": "GitHub",
"license": "CC0-1.0",
"devDependencies": {
"electron": "^1.8.2",
"electron-packager": "^12.1.0"
}
}

  5.在该目录执行cmd命令:npm start 即可查看效果

  6.执行:npm package 即可在目录生成打包文件

Electron使用electron-packager打包记录的更多相关文章

  1. electron原来这么简单----打包你的react、VUE桌面应用程序

    也许你不甘心只写网页,被人叫做"他会写网页",也许你有项目需求,必须写桌面应用,然而你只会前端,没关系.网上的教程很多,但是很少有能说的浅显易懂的,我尽力将electron打包应用 ...

  2. 【Electron】Electron开发入门(六):项目生成setup安装程序

    把electron发布的exe打包成setup安装程序,需要使用nsis软件, nsis打包的详细教程,可以参考我的这篇文章: win7下nsis打包exe安装程序教程

  3. 【Electron】Electron Icon 图标说明、及常见问题

    [Electron]Electron Icon 图标说明.及常见问题 其实各种打包模块都有相关的文档说明,相关链接如下: electron-builder:https://www.electron.b ...

  4. 【Electron】Electron开发入门(二):创建项目Hello Word

    创建简单的Electron程序 1.首先,切换到你的项目空间,我的在 D:\ProjectsSpace\ElectronProjects\ElectronTest,ElectronTest是案例项目文 ...

  5. electron桌面通知,修改默认通知应用名electron.app.Electron为自己应用的名称

    在做electron桌面通知时,按照文档实现弹出通知,但是默认的应用名为electron.app.Electron 解决办法 就是在主进程中设置 app.setAppUserModelId('myAp ...

  6. 【Electron】Electron开发入门(五):项目打包

    一.安装 electron-packager PS:安装之前,先复制一份package.json文件到./app目录下,然后改下./app目录下package.json里 "main&quo ...

  7. Electron开发笔记—electron-builder打包流程

    该文章说明基于win平台下,mac及linux没有实验 关于electron-builder打包可以有两种方案: 1. 打包成文件夹及绿色免安装: electron-builder --dir(依赖w ...

  8. 【Electron】Electron开发入门

    Electron简介: Electron提供了丰富的本地(操作系统)的API,使你能够使用纯JavaScript来创建桌面应用程序,并且跨平台(win,mac,linux等各种PC端平台).与其它各种 ...

  9. 第一章 Electron介绍 | Electron in Action(中译)

    Github 官方地址 代表作: Visual Studio Code Atom - Code editor. Github开源的代码编辑器,Electron起源地 Visual Studio Cod ...

随机推荐

  1. nginx部署vue跨域proxy方式

    server { listen 80; charset utf-8; #server_name localhost; server_name you_h5_name; ###VUE项目H5域名 err ...

  2. $AT2292\ Division\ into\ Two$ $dp$

    正解:$dp$ 解题报告: 传送门$QwQ$ 不妨令$A\geq B$,于是先$sort$然后预处理判下如果有三个元素两两差都小于$B$的就直接$GG$了. 然后考虑对集合$X$进行$dp$,剩下的数 ...

  3. JVM探秘:Java内存区域

    本系列笔记主要基于<深入理解Java虚拟机:JVM高级特性与最佳实践 第2版>,是这本书的读书笔记. 概述 Java 虚拟机为程序员分担了很多内存管理的工作,不再像 C/C++ 那样容易出 ...

  4. 从零开始安装Redis 集群(Linux CenOS7)

    从零开始安装Redis 集群(Linux CenOS7) 使用ISO安装CentOS7虚拟机 配置静态IP(参考Mac VMware Fusion CentOS7配置静态IP) 安装vim [root ...

  5. Codeforces Round #524 (Div. 2)(前三题题解)

    这场比赛手速场+数学场,像我这样读题都读不大懂的蒟蒻表示呵呵呵. 第四题搞了半天,大概想出来了,但来不及(中途家里网炸了)查错,于是我交了两次丢了100分.幸亏这次没有掉rating. 比赛传送门:h ...

  6. react项目使用antd

    在开始实践之前要确保搭建React单页面开发环境,如果还没有搭建好开发环境的朋友请移步到如何搭建React单页面开发环境. 首先在命令行模式下创建一个React项目(项目名使用小写字母命名):(win ...

  7. vue项目使用v-charts的柱形图的各种样式和数据配置

    找了很多网上关于v-charts的柱形图使用,我发现我一模一样的配置就是没有效果,我原来是按需引入的, import VeHistogram from 'v-charts/lib/histogram' ...

  8. 1209. Construct the Rectangle

    1209. Construct the Rectangle class Solution { public: /** * @param area: web page’s area * @retur ...

  9. c++中减字符0的作用(转)

    在刷OJ题的时候遇到要读取“2013-3-1”形式的日期然后计算这个日期是该年的第几天, 显然我们读取的是字符串,但是计算第几天却要整型数来计算,这是这个问题的难点,下面是解决这个问题的代码: int ...

  10. winds消息大全

    本文链接:https://blog.csdn.net/testcs_dn/article/details/42360547 消息,就是指Windows发出的一个通知,告诉应用程序某个事情发生了.例如, ...