最近闲来无事,玩玩electron。

1、安装nodejs

下载地址:http://nodejs.cn/download/,下载64位。安装完成后,打开C:\Program Files\nodejs\node_modules\npm目录,编辑npmrc文件,添加electron_mirror="https://npm.taobao.org/mirrors/electron/"。添加Electron的镜像。

2、新建文件夹DesktopApp,然后新建三个文件:

main.js  主逻辑文件

index.html 页面文件

package.json nodejs标准文件

在DesktopApp文件夹下,运行npm install electron。安装完成后,自动生成:package-lock.json和node_modules文件夹。

3、main.js文件

const electron = require('electron');
const app = electron.app;
const BrowserWindow = electron.BrowserWindow; var mainWindow = null; app.on('window-all-closed', function() {
if (process.platform != 'darwin') {
app.quit();
}
}); app.on('ready', function() {
mainWindow = new BrowserWindow({width: 800, height: 600});
mainWindow.loadURL('file://' + __dirname + '/index.html');
mainWindow.on('closed', function() {
mainWindow = null;
});
});

4、package.json文件

{
"name": "DesktopApp",
"version": "0.1.0",
"main": "main.js",
"dependencies": {
"electron": "^1.6.11"
}
}

5、index.html文件

<!DOCTYPE html>
<html>
<head>
<title>Hello World!</title>
</head>
<body>
<h1>Hello World!</h1>
We are using io.js <script>document.write(process.version)</script>
and Electron <script>document.write(process.versions['electron'])</script>.
</body>
</html>

6、运行:

C:\>D:\DesktopApp\node_modules\electron\dist\electron.exe D:\DesktopApp

(用局部安装的electron的exe文件来执行项目)

Windows Electron初探的更多相关文章

  1. Windows消息初探(1)

    Windows消息初探(1) 最近恢复对Windows API的学习,深深感受到没有对应的中文资料的痛苦,于是上MSDN上面去将Windows消息搞了一些回来翻译出来,供自己查阅,也与大家分享,能力有 ...

  2. Electron初探

    H5开发桌面应用? 没错,H5现在也可以开发跨平台的桌面应用了,这意味着我们可以用网页来设计和制作桌面应用. 基于Node.js的Electron框架就可以实现桌面应用,比较有名的Electron框架 ...

  3. electron——初探

    是什么? Electron是由Github开发,用HTML,CSS和JavaScript来构建跨平台桌面应用程序的一个开源库. Electron通过将Chromium和Node.js合并到同一个运行时 ...

  4. 接口自动化 Windows + HttpRunner 初探(一)

    运行环境 HttpRunner 是一个基于 Python 开发的测试框架,可以运行在 macOS.Linux.Windows 系统平台上. HttpRunner 的开发环境为 macOS + Pyth ...

  5. electron初探问题总结

    使用electron时间不是很久,随着使用的深入慢慢的也遇到一些问题,下面总结一下遇到的问题与大家分享,避免趟坑. 主要问题汇总如下: webview与渲染进程renderer间通信 BrowserW ...

  6. crossplatform---electron Quick Start

    Electron enables you to create desktop applications with pure JavaScript by providing a runtime with ...

  7. electron-利用node开发桌面应用

    简介 web前端语言的发展有目共睹, 从原来的pc web, 到后来的mobile SAP, 再到 nodejs,全站工程师应运而生. js快速而且稳健的发展让人不得不重视, 相应的前端开发人员的地位 ...

  8. 用electrion打包angular成桌面应用

    用electrion官网的不行. 还好,可以直接照搬 https://github.com/maximegris/angular-electron 安装必要的库 npm i --save-dev el ...

  9. Sentry 开发者贡献指南 - SDK 开发(事件负载)

    内容整理自官方开发文档 系列 Docker Compose 部署与故障排除详解 1 分钟快速使用 Docker 上手最新版 Sentry-CLI - 创建版本 快速使用 Docker 上手 Sentr ...

随机推荐

  1. 开源的图片查看库之PhotoView

    PhotoView是一个开源的图片查看库,可以实现图片的浏览,手势放大缩小等操作,以及支持在ViewPager中翻页浏览图片等功能.PhotoView使用简单,还可以对缩放模式进行设置, 其开源地址为 ...

  2. vue中html、js、vue文件之间的简单引用与关系

    有关vue文件记录:index.html在html中运用组件 <body> <app></app> <!-- 此处app的组件为入口js main.js中定义 ...

  3. PS技巧集合

    一.把图片变模糊 图像——调整——色阶——输出色阶——滤镜——模糊——高斯模糊——半径 二.图片换色 点击右下角弹层下方的“fx”——颜色叠加——色样颜色

  4. Eureka 2.0 闭源--选择Consul???[转]

    原文链接: https://www.cnblogs.com/williamjie/p/9369800.html 在上个月我们知道 Eureka 2.0 闭源了,但其实对国内的用户影响甚小,一方面国内大 ...

  5. SQL Server 等待统计信息基线收集

    背景 我们随时监控每个服务器不同时间段的wait statistics ,可以根据监控信息大概判断什么时候开始出现异常,相当于一个wait statistics基线收集,还可以具体分析占比高的等待类型 ...

  6. 跨平台python异步回调机制实现和使用方法

    跨平台python异步回调机制实现和使用方法 这篇文章主要介绍了python异步回调机制的实现方法,提供了使用方法代码 1 将下面代码拷贝到一个文件,命名为asyncore.py 代码如下: impo ...

  7. python3.4 + pycharm安装与使用

    因个人是windows的环境,所以本文只讲windows环境下的python安装. 作为初用python的盆友,强烈建议只在电脑上装一个python版本就好了,不然就进了各种坑里了. Python安装 ...

  8. mysql数据的备份

    一.备份方式 1.备份:逻辑备份(mysqldump,mydumper).物理备份(xtrabackup.tar.cp.rsync)    2.冗余:主备模式.数据库集群 二.备份对象 1.数据(库. ...

  9. cisco RIP(传闻协议)Routing information protocol

    Corp(config)#rout rip Corp(config-router)#network 10.0.0.0 10.0.0.0/24 is subnetted, 5 subnets C 10. ...

  10. 统计学习方法 | 第3章 k邻近法 | 补充

    namedtuple 不必再通过索引值进行访问,你可以把它看做一个字典通过名字进行访问,只不过其中的值是不能改变的. sorted()适用于任何可迭代容器,list.sort()仅支持list(本身就 ...