使用Electron开发第一个应用

Electron 应用的目录结构如下：

app/ 
├── package.json 
├── main.js 
└── index.html

新建一个app文件夹 将这三个文件都放在里面 
package.json的内容

{

  "name"    : "app",

  "version" : "0.1.0",

  "main"    : "main.js"

}
  • 1
  • 2
  • 3
  • 4
  • 5

注意：如果 main 字段没有在 package.json 声明，Electron会优先加载 index.js

main.js的内容

var app = require('app');  。

var BrowserWindow = require('browser-window');

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;

  });

});
  • 1
  • 2
  • 3
  • 4
  • 5
  • 6
  • 7
  • 8
  • 9
  • 10
  • 11
  • 12
  • 13
  • 14
  • 15
  • 16
  • 17
  • 18

index.html的内容

<!DOCTYPE html>

<html>

  <head>

    <title>Hello World!</title>

  </head>

  <body>

    <h1>Hello World!</h1>

  </body>

</html>
  • 1
  • 2
  • 3
  • 4
  • 5
  • 6
  • 7
  • 8
  • 9

运行方法

直接打开electron.exe 将app文件夹拖进去就可以了 

或者在cmd窗口 输入electron.exe 参数是app文件夹所在的路径

Electron-使用Electron开发第一个应用的更多相关文章

  1. （译）通过 HTML、JS 和 Electron 创建你的第一个桌面应用

    原文:Creating Your First Desktop App With HTML, JS and Electron 作者:Danny Markov 近年来 web 应用变得越来越强大,但是桌面 ...

  2. 第一章 Electron介绍 | Electron in Action(中译)

    Github 官方地址 代表作: Visual Studio Code Atom - Code editor. Github开源的代码编辑器,Electron起源地 Visual Studio Cod ...

  3. 【Electron】Electron开发入门（二）：创建项目Hello Word

    创建简单的Electron程序 1.首先,切换到你的项目空间,我的在 D:\ProjectsSpace\ElectronProjects\ElectronTest,ElectronTest是案例项目文 ...

  4. Vite ❤ Electron——基于Vite搭建Electron+Vue3的开发环境【一】

    背景 目前社区两大Vue+Electron的脚手架:electron-vue和vue-cli-plugin-electron-builder, 都有这样那样的问题,且都还不支持Vue3,然而Vue3已 ...

  5. 中文代码示例之Electron桌面应用开发初体验

    参考: 打造你的第一个 Electron 应用 首先运行下面在目录下创建package.json: $ npm init 去掉了一些无关项后内容如下: { "name": &quo ...

  6. Electron结合React开发环境遇到的问题

    链接 将create-react-app与electron集成在了一个项目中.但是在React中无法使用electron 当在React中使用require('electron')时就会报TypeEr ...

  7. Cordova - 使用Cordova开发iOS应用实战1（配置、开发第一个应用）

    Cordova - 使用Cordova开发iOS应用实战1(配置.开发第一个应用) 现在比较流行使用 html5 开发移动应用,毕竟只要写一套html页面就可以适配各种移动设备,大大节省了跨平台应用的 ...

  8. iOS开发——高级技术精选&底层开发之越狱开发第一篇

    底层开发之越狱开发第一篇 做越狱开发也有一些时间了,有很多东西想总结一下,希望给他人一些借鉴,也是自己对过去开发经历的一些总结.个人不推荐使用盗版,这里主要以技术介绍为主. 这个系列里面主要介绍怎样进 ...

  9. 【翻译习作】 Windows Workflow Foundation程序开发-第一章05

    1.3      开发我们的第一个工作流 也许你曾经在这样的产品经理手下搞过开发:他总是在你身边转悠,并不时的问一句“你还没做完吗?”.在这一部分,我们将用一个简单的Windows Workflow程 ...

随机推荐

  1. 两个NetSuite之间历史交易数据迁移的具体方案

    背景与展望: 比如:公司要上市往往会要求提供过去几年的营业数据和报表等信息, 而这些信息来源于正在一直运营使用的ERP和财务系统是最可靠与真实的. NetSuite实现的ERP和财务系统的完美结合,随 ...

  2. Redis3.2+Tomcat实现集群的Session管理 -- tomcat-redis-session-manager的编译和开发部署环境搭建

    已经有不少文章介绍使用tomcat-redis-session-manager来实现Redis存储Tomcat的Session,实现分布式Session管理.但是现在官方编译的tomcat-redis ...

  3. sharepoint 2013 入门1_ 建立一个网页程序

    步骤: 1.新建项目. 2.项目到office/sharepoint 解决方案=>sharepoint2013 空项目 3.sharepoint 自定义向导(电脑必须要装sharepoint 不 ...

  4. 【转】T-SQL查询进阶—理解SQL Server中的锁

      简介 在SQL Server中,每一个查询都会找到最短路径实现自己的目标.如果数据库只接受一个连接一次只执行一个查询.那么查询当然是要多快好省的完成工作.但对于大多数数据库来说是需要同时处理多个查 ...

  5. Android 基础概念了解

    Android 的前世今生Android 系统框架Android 主要组成 部分Android 常用的操作 Android 的前世今生 Android 的诞生 2003年10月,有"Andr ...

  6. LINUX安全加固规范

    1 概述 近几年来Internet变得更加不安全了.网络的通信量日益加大,越来越多的重要交易正在通过网络完成,与此同时数据被损坏.截取和修改的风险也在增加. 只要有值得偷窃的东西就会有想办法窃取它的人 ...

  7. 关于欧几里得算法求最大公约数，即OJ1029的参考解法

    #include <stdio.h> int main(int argc, char *argv[]) { int a,b,c; scanf("%d %d",& ...

  8. html5视屏背景注意事项。

    在动手编码实现前,视频作为网页背景的有些问题我们要先考虑清楚: 并不是因为技术上可行你就可以任意使用:作为背景的视频内容必须能增强页面内容的感染力,而不是因为漂亮或技术上很酷就使用它. 作为背景的视频 ...

  9. c++共享内存（转载）

    对于连个不同的进程之间的通信,共享内存是一种比较好的方式,一个进程把数据发送到共享内存中, 另一个进程可以读取改数据,简单记录一下代码 #define BUF_SIZE 256 TCHAR szNam ...

  10. PostGIS导入导出SHP文件常用命令

    SHP导入POSTGIS数据库 引用 直接导入数据库 shp2pgsql  -I -s 2437 -W GBK shop_point.shp public.ntable | psql -U postg ...