使用 JavaScript, HTML 和 CSS 构建跨平台的桌面应用
- https://electronjs.org/ —— 官网
- https://github.com/electron/electron-api-demos/releases —— 下载demo
下载安装:
# 克隆示例项目的仓库
$ git clone https://github.com/electron/electron-quick-start # 进入这个仓库
$ cd electron-quick-start # 安装依赖并运行
$ npm install && npm start
安装打包插件/安装并打包:
npm install electron-packager -g
参数如下为打包执行命令的原型:
electron-packager <sourcedir> <appname> --platform=<platform> --arch=<arch> [optional flags...]执行如下:
electron-packager . app --win --out presenterTool --arch=x64 --version 1.4.14 --overwrite --ignore=node_modules
成功运行完成后,生成文件:点击查看结果如下:
部分参数解释:
rimraf
一个豪华版本的rm -rf
,兼容window。cross-env
一个豪华版本的环境变量设置,有NODE_ENV=*
的地方,就可以考虑使用cross-env,兼容window。./
,一般为package.json的位置。具体可以见这里:https://newsn.net/say/electron-quick-start-modify.htmlappname
,这个会影响你打包完毕的可执行文件(exe/dmg)的名字(appname.exe)。--platform
和--arch
,这两个参数有非常多的变形。这里有详细解释:https://newsn.net/say/electron-packager-basic.html--win32metadata.FileDescription
,文件描述信息。见这里:https://newsn.net/say/electron-packager-exe-info.html--overwrite
,是否覆盖原有的生成文件。它和下面几项有关系:--out=out
、--ignore=out
、rimraf out
。--ignore
,要排除掉的不打包的文件,可以叠加效果。主要是出于减少最终文件大小的考虑。--no-prune
,这个参数请慎用,是说不处理node_modules里面dev依赖包,把相关的代码都放进最终asar里面。默认情况下,是会将dev相关的node_modules里面的包给去除之后,再打包的。注意:目前的最新版electron-packager里面没有--prune
参数。--electron-version
,指定打包时使用的electron的版本。见这里:https://newsn.net/say/electron-packager-control-version.html 。注意:最新版的electron-packager
没有--version
参数。--out
打包完的可执行文件,放在在哪里。--icon
设置打包的时候的图标。敲黑板重点,天天有人问如何更换这个图标,就这里更换。图标制作的问题,请参见:https://newsn.net/say/electron-mac-icns.html 和 https://newsn.net/say/electron-ico-format.html 。图标都是特制的图标,妄图不制作图标就能完美无缺更换的想法,都是徒劳的。千万牢记。--asar
打包选项,是否在resource文件夹下面,生成app.asar文件。否则将会是个app文件夹加上自己的代码文件。
使用 JavaScript, HTML 和 CSS 构建跨平台的桌面应用的更多相关文章
- .NET Core 构建跨平台的桌面应用
1.运行环境 开发工具:Visual Studio 2017 JDK版本:.NET Core 2.0 项目管理工具:nuget 2.GITHUB地址 https://github.com/nbfujx ...
- Electron - 创建跨平台的桌面客户的应用程序
Electron 框架的前身是 Atom Shell,可以让你写使用 JavaScript,HTML 和 CSS 构建跨平台的桌面应用程序.它是基于io.js 和 Chromium 开源项目,并用于在 ...
- NativeScript - JS 构建跨平台的原生 APP
使用 NativeScript,你可以用现有的 JavaScript 和 CSS 技术来编写 iOS.Android 和 Windows Phone 原生移动应用程序.由原生平台的呈现引擎呈现界面而不 ...
- 小白学jquery Mobile《构建跨平台APP:jQuery Mobile移动应用实战》连载四(场景切换)
作为一款真正有使用价值的应用,首先应该至少有两个页面,通过页面的切换来实现更多的交互.比如手机人人网,打开以后先是进入登录页面,登录后会有新鲜事,然后拉开左边的面板,能看到相册.悄悄话.应用之类的其他 ...
- 白学jquery Mobile《构建跨平台APP:jQuery Mobile移动应用实战》串行4(场景变化)
作为一个真正的利用价格值应用,首先,你应该至少有两页,通过切换页面来实现很多其他互动.比如手机人人网,首先,打开后进入登录页面,将有登录后,新的东西.然后拉左侧面板.你可以看到相册.私人信息.像其他应 ...
- Molecule – 帮助你构建跨平台的 HTML5 游戏
Molecule 框架由拥有超过五年手机游戏开发经验的游戏开发者开发.由于移动浏览器与实际的 HTML5 规范的兼容性的改进和内部硬件的自然进化,HTML5 手机游戏真正有可能流行起来. 您可能感兴趣 ...
- 【原创】小白学jquery Mobile《构建跨平台APP:jQuery Mobile移动应用实战》连载五(给按钮加图标)
在范例5-4所使用的导航栏中,已经为按钮加入了图标的样式,但是当时并没有介绍按钮的图标究竟是怎么一回事.下面截取范例5-4中导航栏部分的代码: <divdata-role="foote ...
- jquery Mobile应用第2课《构建跨平台APP:jQuery Mobile移动应用实战》连载二(简单的QWER键盘)
在jQuery Mobile的布局中,控件大多都是单独占据页面中的一行,按钮自然也不例外,但是仍然有一些方法能够让多个按钮组成一行,比如说在范例6-5中就利用按钮分组的方法使4个按钮并列在一行中,如图 ...
- jqueryMobile应用第一课《构建跨平台APP:jQuery Mobile移动应用实战》连载一(Hello World)
有人说每个程序员都曾经有过改变世界的梦想,笔者认为,这与程序员年轻时编写的第一个程序有着莫大的关系.简简单单的一句“hello world”让年轻的心开始相信梦想,用一种低调的壮志凌云向世界展示自己的 ...
随机推荐
- Python_%---format_43
fat39 博客园 首页 新随笔 联系 订阅 管理 随笔 - 142 文章 - 0 评论 - 0 python基础_格式化输出(%用法和format用法) 目录 %用法 format用法 %用 ...
- dfs实现数的全排列
代码 #include<bits/stdc++.h> using namespace std; #define ll long long bool vis[15]; int a[15]; ...
- Spring.profile配合Jenkins发布War包,实现开发、测试和生产环境的按需切换
前两篇不错 Spring.profile实现开发.测试和生产环境的配置和切换 - Strugglion - 博客园https://www.cnblogs.com/strugglion/p/709102 ...
- AngularJS双向数据绑定
<!DOCTYPE html> <html> <head> <meta charset="UTF-8"> <title> ...
- mybatis事务管理机制详解
1.mybatis事务的配置和使用 mybatis事务有两种使用方式: (a):使用JDBC的事务管理机制:即使用java.Sql.Connection对象完成对事务的提交,回滚和关闭操作. (b): ...
- 重启iis命令
iisreset
- 连接mysql 出现 1005 error(150) , error(121)的错误
1.显示不能创建表 出现150错误 将检查是因为 我的user 表示拷贝过来的所以它设置的编码格式是utf-8 而我又新创建的表没有添加编码格式,所以它认为这两个关联的表之间的编码格式不匹配. 2.出 ...
- python语法糖/装饰器
1.python高阶函数和嵌套函数 1.1高阶函数 def func1(x): return x**2 def func2(x): return x**3 def func(x,y): return ...
- Git发生SSL certificate problem: certificate ha错误的解决方法
这两天,不知道为什么,用Git提交代码到服务器时,总出现SSL certificate problem: unable to get local issuer certificate while ac ...
- B站弹幕姬(🐔)分析与开发(下篇)
接上篇 下面开始分析弹幕信息: 当我们在完成和服务器的握手之后,b站的弹幕服务器就会开始不停的开始给我们推送相关房间的弹幕消息了.老规矩前面16个字节是这个包的相关信息,我们先来看下这条消息的前面16 ...