创建一个应用目录：app，里面需要有必要的三个文件：

index.html

<!DOCTYPE html>

<html>

<head>

<meta charset="UTF-8">

<title>百度</title>

<style type="text/css">

*{margin:0px; padding: 0px;}

#iframe{width: 100%; height: 100%; position: absolute; top:0px; right:0px; bottom:0px; left:0px;}

</style>

</head>

<body>

<iframe id="iframe" frameborder="0" src="https://www.baidu.com/"></iframe>

<script>

// You can also require other files to run in this process

require('./renderer.js')

</script>

</body>

</html>

main.js

// Modules to control application life and create native browser window

const {app, BrowserWindow} = require('electron')

if(require('electron-squirrel-startup')) return;

// Keep a global reference of the window object, if you don't, the window will

// be closed automatically when the JavaScript object is garbage collected.

let mainWindow

function createWindow () {

  // Create the browser window.

  mainWindow = new BrowserWindow({width: 800, height: 600})

  // and load the index.html of the app.

  mainWindow.loadFile('index.html')

  // Open the DevTools.

  // mainWindow.webContents.openDevTools()

  // Emitted when the window is closed.

  mainWindow.on('closed', function () {

    // Dereference the window object, usually you would store windows

    // in an array if your app supports multi windows, this is the time

    // when you should delete the corresponding element.

    mainWindow = null

  })

}

// This method will be called when Electron has finished

// initialization and is ready to create browser windows.

// Some APIs can only be used after this event occurs.

app.on('ready', createWindow)

// Quit when all windows are closed.

app.on('window-all-closed', function () {

  // On OS X it is common for applications and their menu bar

  // to stay active until the user quits explicitly with Cmd + Q

  if (process.platform !== 'darwin') {

    app.quit()

  }

})

app.on('activate', function () {

  // On OS X it's common to re-create a window in the app when the

  // dock icon is clicked and there are no other windows open.

  if (mainWindow === null) {

    createWindow()

  }

})

// In this file you can include the rest of your app's specific main process

// code. You can also put them in separate files and require them here.

package.json

{

  "name": "electron-quick-start",

  "version": "1.0.0",

  "description": "A minimal Electron application",

  "main": "main.js",

  "scripts": {

    "start": "electron .",

    "packager": "electron-packager . electron-quick-start --overwrite --win=x32 --out  ./HelloWorldApp --arch=x64 --app-version=1.0.0 --electron-version=2.0.0"

  },

  "repository": "https://github.com/electron/electron-quick-start",

  "keywords": [

    "Electron",

    "quick",

    "start",

    "tutorial",

    "demo"

  ],

  "author": "GitHub",

  "license": "CC0-1.0",

  "devDependencies": {

    "electron": "^2.0.0",

    "electron-packager": "^12.2.0",

    "electron-winstaller": "^2.7.0"

  },

  "dependencies": {

    "electron-squirrel-startup": "^1.0.0"

  }

}

首先需要先安装：

npm install

在项目目录运行：

electron-packager . electron-quick-start --overwrite --win=x32 --out  ./HelloWorldApp --arch=x64 --app-version=1.0.0 --electron-version=2.0.0

就会看到多了个：HelloWorldApp，在这个目录下的 electron-quick-start-win32-x64 目录下的 .exe 文件就是打包好的客户端文件。

electron---项目打包的更多相关文章

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

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

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

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

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

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

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

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

  5. Electron – 基础学习(2): 项目打包成exe桌面应用 之electron-packager

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

  6. react-electron 项目打包体积尽可能减小的方法

    当一个react-electron项目做好之后就可以开始进行打包,首先就是打包react,这个自然不用多说,不过事先要记住一点,项目目录主进程文件main.js最好放在根目录,再执行打包命令 npm ...

  7. 图解使用VS的安装项目打包程序

    背景 这段时间一直在做客户端程序的打包程序,遇到各种坑.因为以前没有任何这方面的经验,历经各种折腾,费尽九牛二虎之力总算是完成了. 虽然没有太多技术含量,但是因为挺繁琐的,所以还是在此记录一下. 由于 ...

  8. 将 java 项目打包成可运行的 jar 包（main 函数带参数），并上传到 linux 服务器上运行

    一.概述 java项目有两种架构,一种是 B/S 架构的,一种是 C/S 架构的. 对于 B/S 架构来说,我们常见的 java ee 即是 B/S 架构,通常,开发人员会在本地进行开发,然后将项目打 ...

  9. maven 项目打包 及window下部署到tomcat

    1.maven项目打包 2.将war文件拷贝到tomcat目录webapps下(不要再建目录)3.将必要的jar文件拷贝到tomcat目录libx下 war包 或jar 包 会生成到项目所在路径 的t ...

  10. Storm系列（三）：创建Maven项目打包提交wordcount到Storm集群

    在上一篇博客中,我们通过Storm.Net.Adapter创建了一个使用Csharp编写的Storm Topology - wordcount.本文将介绍如何编写Java端的程序以及如何发布到测试的S ...

随机推荐

  1. Java开发环境之ActiveMQ

    查看更多Java开发环境配置,请点击<Java开发环境配置大全> 柒章:ActiveMQ安装教程 1)去官网下载ActiveMQ安装包 http://activemq.apache.org ...

  2. 免费的天气API测试接口

    网上几乎所有的天气接口都需要注册key,然后还各种频率限制,每天调用次数才几百次? 太坑爹了吧 一个简单的天气预报功能, 为什么要搞的这么复杂, 收什么费? 推荐一个真正免费的天气API接口, 返回j ...

  3. 02-CSS常用样式

    本篇主要介绍css的常用样式,以及网页布局相关知识.绝对定位和相对定位,盒子模型.css权重.以及css选择器: 绪论:CSS基本介绍 为了让网页元素的样式更加丰富,也为了让网页的内容和样式能拆分开, ...

  4. LINUX下查看日志信息

    Linux下grep显示多行信息标准unix/linux下的grep通过以下参数控制上下文 grep -C 5 foo file 显示file文件中匹配foo字串那行以及上下5行 例如 grep -C ...

  5. PEP 8016-Python之父重回决策层

      PEP 8016-Python之父重回决策层 作者:尹正杰 版权声明:原创作品,谢绝转载!否则将追究法律责任. 去年,技术社区里还发生了一件大事:Linux 之父 Linus Torvalds 宣 ...

  6. ExecutorService java多线程分割list运行

    调用方法 int threadNum = 7; while(true) { List<FaceAnalyseImage> list = faceAnalyseImageMapper.sel ...

  7. Codeforces Round #574 (Div. 2)题解

    比赛链接 传送门 A题 题意 \(n\)个人每个人都有自己喜欢喝的\(vechorka\)口味,现在给你\(\lceil n/2\rceil\)箱\(vechorka\),每箱有两瓶,问最多能有多少个 ...

  8. CentOS 7.5下KVM的安装与配置

    由于没有物理机可用,在自己的VMware Workstation中CentOS 7.5下搭建完成. 首先查看VMware Workstation是否支持虚拟化,把红框内打钩即可. 虚拟化开启并安装Ce ...

  9. TCP和UDP的常见面试题

    问题1]为什么连接的时候是三次握手,关闭的时候却是四次握手? 答:因为当Server端收到Client端的SYN连接请求报文后,可以直接发送SYN+ACK报文.其中ACK报文是用来应答的,SYN报文是 ...

  10. 互联网UV，PU，TopN统计

    1. UV.PV.TopN概念 1.1 UV(unique visitor) 即独立访客数 指访问某个站点或点击某个网页的不同IP地址的人数.在同一天内,UV只记录第一次进入网站的具有独立IP的访问者 ...