Electron:将前端应用打包成桌面应用
首先戳我下载安装对应版本的node.js。
安装完成后,打开命令行输入node -v以及npm -v查看对应版本。能够正常显示说明安装成功。

写一个最简单的hello world的nodejs应用。nodejs的基础目录结构如图:

♦ node_modules文件夹用于存放开发或应用时的依赖
♦ index.html:初始化的页面
♦ main.js:生命周期控制
♦ package.json:全局配置
如果有小伙伴不知道怎么写,可以参考https://github.com/electron/electron-quick-start
我写好了一个简单的html:

注:如果在代码中使用jQuery时遇到问题,请参考
戳我下载Electron。下载完Electron后需要在package.json中添加如下代码(版本号需要对应,别忘了用逗号分隔)
"devDependencies":{
"electron":"1.6.2"
},
打开Electron,将我们写好的程序包拖到Electron下方的窗口中

我们就得到了一个预览版的桌面应用程序

窗体的大小都可以在main.js中进行配置。
下一步进行程序的打包,在cmd命令行中执行以下命令:
npm install electron-packager --save-dev
打开package.json,发现devDependencies中新加了一个electron-packager的版本。

在package.json中在加上如下代码:
"scripts": {
"package":"electron-packager ./ demo --platform=win32 --arch=x64 --version=1.6.2"
},
♦ package:script脚本的名称
♦ demo:打包后的程序的名字
♦ platform:操作系统(这边是windows系统)
♦ arch:系统的位数(这边是64位)
♦ version:electron的版本号
在cmd命令行中,运行如下代码:
npm run-script package
运行完了,当前目录下会生成一个文件夹,名称为程序名+操作系统+位数。

成功将web应用转化为桌面应用。
Electron:将前端应用打包成桌面应用的更多相关文章
- Electron把网页打包成桌面应用并进行源码加密
前言 最近想把自己用html+css+js做的网页界面打包成桌面应用,网上一搜,发现Electron是一个不错的选择,试了试,发现效果真的不错.这里记录一下打包过程以作记录,便于自己以后查看学习. 一 ...
- electron将网站打包成桌面应用
需求同 NW.js将网站打包成桌面应用 1. 从github上克隆electron示例项目 git clone https://github.com/electron/electron-quick-s ...
- nodejs打包成桌面程序(exe)的进阶之路
nodejs打包成桌面程序(exe)的进阶之路 node js bat 前端 计划任务 前言:最近的研究,请大佬们细品 第一篇 - 任务计划程序篇 说真的研究到将nodejs打包成可执行的exe文件是 ...
- 用node-webkit把web应用打包成桌面应用
node-webkit是一个Chromium和node.js上的结合体,通过它我们可以把建立在chrome浏览器和node.js上的web应用打包成桌面应用,而且还可以跨平台的哦.很显然比起传统的桌面 ...
- 前端打包成桌面应用、以及chrome扩展
前段时间在利用工作之余开发了tomato timer这个蕃茄钟,然后部署到github.io上,由于greatway太厉害,偶尔会有打不开的情况.上周末对比做了扩展和改进,使其成为chrome的插件, ...
- electron 打包成桌面运用
最近在学习nodejs,得知Electron是通过将Chromium和Node.js合并到同一个运行时环境中,用HTML,CSS和JavaScript来构建跨平台桌面应用程序的一门技术.对于之前一直从 ...
- electron打包成桌面应用程序的详细介绍
1.前提条件 a. 安装了node b.安装了electron c.你知道自己写的东西(js,css,html等等)放在那个文件夹(假设这个文件夹命名为 app,下面会用到)中 2.安装electro ...
- 将你的前端应用打包成docker镜像并部署到服务器?仅需一个脚本搞定
1.前言 前段时间,自己搞了个阿里云的服务器.想自己在上面折腾,但是不想因为自己瞎折腾而污染了现有的环境.毕竟,现在的阿里云已经没有免费的快照服务了.要想还原的话,最简单的办法就是重新装系统.而一旦重 ...
- 2、node-webkit运行web应用,node-webkit把web应用打包成桌面应用
下面我通过一个简单的demo来介绍怎么样把一个web应用打包成一个可执行文件(这里只介绍windows环境) 首先新建一个index.html文件,作为我们这个demo的入口页面,我们暂且就把这个页面 ...
随机推荐
- [cerc2012][Gym100624C]20181013
题意:用元素符号表示字符串 题解:签到题 简单dp 难点在于把元素符号都改成小写qaq #include<cstdio> #include<cstdlib> #include& ...
- 【51NOD-0】1058 N的阶乘的长度
[算法]数学 [题解]n!的位数相当于ans=log10(n!)上取整,然后就可以拆出来加了. 可以用log10(i)或log(i)/log(10) 阶乘好像有个斯特林公式…… #include< ...
- Bazinga(HDU5510+KMP)
t题目链接:http://acm.hdu.edu.cn/showproblem.php?pid=5510 题目: 题意:找到一个编号最大的字符串满足:存在一个编号比它小的字符串不是它的字串. 思路:K ...
- Codeforces Round #494 (Div. 3)
刚好在考完当天有一场div3,就开了个小号打了,打的途中被辅导员喊去帮忙,搞了二十分钟-_-||,最后就出了四题,题解如下:题目链接:http://codeforces.com/contest/100 ...
- 利用Python 发送邮件
概要 我们都知道SMTP(简单邮件传输协议),是一组用于从原地址到目的地址传输邮件的规范,通过它来控制邮件的中转方式.SMTP规定电子邮件应该如何格式化.如何加密,以及如何在邮件服务器之间传递.SMT ...
- V4L2(二)虚拟摄像头驱动vivi深入分析【转】
转自:http://www.cnblogs.com/tureno/articles/6694463.html 转载于: http://blog.csdn.net/lizuobin2/article/d ...
- 【LOJ6201】【bzoj4939】【YNOI2016】掉进兔子洞
一道比较简单的莫队…… 用bitset维护三个区间的交元素. #include<bits/stdc++.h> ; ; #define UI unsigned int #define rep ...
- Python爬虫之百度API调用
调用百度API获取经纬度信息. import requests import json address = input('请输入地点:') par = {'address': address, 'ke ...
- 微信小程序验证码获取倒计时
wxml <button disabled='{{disabled}}' bindtap="goGetCode">{{code}}</button> js ...
- jq监听ajax执行开始,出错,结束。
$(“#msg”).ajaxComplete(function(event,request, settings){ $(this).append(“<li>请求完成.</li&g ...