最近闲来无事，玩玩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文件

  1. const electron = require('electron');
  2. const app = electron.app;
  3. const BrowserWindow = electron.BrowserWindow;
  4.  
  5. var mainWindow = null;
  6.  
  7. app.on('window-all-closed', function() {
  8.   if (process.platform != 'darwin') {
  9.     app.quit();
  10.   }
  11. });
  12.  
  13. app.on('ready', function() {
  14.   mainWindow = new BrowserWindow({width: 800, height: 600});
  15.   mainWindow.loadURL('file://' + __dirname + '/index.html');
  16.   mainWindow.on('closed', function() {
  17.     mainWindow = null;
  18.   });
  19. });

4、package.json文件

  1. {
  2.   "name": "DesktopApp",
  3.   "version": "0.1.0",
  4.   "main": "main.js",
  5.   "dependencies": {
  6.     "electron": "^1.6.11"
  7.   }
  8. }

5、index.html文件

  1. <!DOCTYPE html>
  2. <html>
  3.   <head>
  4.     <title>Hello World!</title>
  5.   </head>
  6.   <body>
  7.     <h1>Hello World!</h1>
  8.     We are using io.js <script>document.write(process.version)</script>
  9.     and Electron <script>document.write(process.versions['electron'])</script>.
  10.   </body>
  11. </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. TortoiseSvn客户端介绍

    TortoiseSVN 是svn版本控制系统的一个免费开源客户端,它是svn版本控制的 Windows 扩展.可以使你避免使用枯燥而且不方便的命令行.它完全嵌入 Windows Explorer,使用 ...

  2. JNI的开发步骤

    使用C函数实现Java本地方法: 1. 在java代码里面声明一个native的方法 public native String helloFromC(); 2. 在工程目录下面创建一个jni的文件夹 ...

  3. 解决 Elasticsearch 超过 10000 条无法查询的问题

    解决 Elasticsearch 超过 10000 条无法查询的问题 问题描述 分页查询场景,当查询记录数超过 10000 条时,会报错. 使用 Kibana 的 Dev Tools 工具查询 从第 ...

  4. Kafka集群安裝部署(自带Zookeeper)

    kafka简介 kafka官网:http://kafka.apache.org/ kafka下载页面:http://kafka.apache.org/downloads kafka配置快速入门:htt ...

  5. jdk1.8-LinkedList源码分析

    一:类的继承关系 我们看下类的继承关系 ) ) )) { ; i > index; i--) //当前记录结点等于上一节点 x = x.prev; //返回索引为index的点! return ...

  6. php 通过mysqli 操作数据库mysql

    目录 php mysqli 操作数据库 连接数据库 通过mysqli 创建数据库 通过mysqi 创建数据表 通过mysqli向数据表中插入信息 通过mysqli 读取数据 where语句的应用 通过 ...

  7. PHP进阶之路 -- 01 PHP基础语法

    PHP进阶之路 --  PHP基础语法 windows环境下php环境 php定界符  php变量  php数据类型 数据类型转换 检测数据类型 php中三种输出方式 php字符集设置 php常量 p ...

  8. 利用nginx做反向代理解决前端跨域问题

    最近朋友再群里提了一个问题,他们公司给他提供了一个获取数据的接口,在浏览器访问这个接口能获取到json数据,但是放在项目里使用ajax就产生了跨域问题,一般这个需要提供接口的后台方面需要做跨域处理,但 ...

  9. python-Web-django-钩子验证

    全局钩子验证: ‘’’ 打包前端input,views数据处理,链接moduls数据库,用来验证 ’’’ Views: Form=UserForm(request.POST)实例化对象 Form.cl ...

  10. C学习笔记-结构体

    结构体的定义和初始化 结构体是简单数据类型的综合 struct man { char name[100]; int age; }; struct man m = { "tom", ...