1 开发环境:node环境

2 下载electron:npm install electron --save-dev

3 package.json配置如下:

{
  "name": "demo",
  "version": "1.0.0",
  "description": "",
  "main": "index.js",
  "scripts": {
    "start": "electron ."
  },
  "author": "",
  "license": "ISC",
  "devDependencies": {
    "electron": "^4.0.1"
  }
}

4 index.js代码如下:

const {app,BrowserWindow } = require("electron");
let win;

function createWindow() {
    //创建一个新窗口
    win = new BrowserWindow({
        //充满全屏
        webPreferences: {
            nodeIntegration: false
        },
        fullscreen:true
    });
    //加载主页面

    win.loadFile("./client-small-screen-show.html");
    //打开开发者工具
    win.webContents.openDevTools();
    //创建的窗口关闭
    win.on('closed', () => {
        // 取消引用 window 对象,如果你的应用支持多窗口的话,
        // 通常会把多个 window 对象存放在一个数组里面,
        // 与此同时,你应该删除相应的元素。
        win = null
    })
}
app.on("open-file",()=>{
    console.log(arguments);
});
//程序准备完成
app.on('ready', createWindow);
//程序的所有窗口关闭
app.on('window-all-closed', () => {
    // 在 macOS 上,除非用户用 Cmd + Q 确定地退出,
    // 否则绝大部分应用及其菜单栏会保持激活。
    if (process.platform !== 'darwin') {
        app.quit()
    }
});
//点击托盘图标的时候
app.on('activate', () => {
    // 在macOS上,当单击dock图标并且没有其他窗口打开时,
    // 通常在应用程序中重新创建一个窗口。
    if (win === null) {
        createWindow()
    }
});
//程序退出之前
app.on("before-quit",()=>{
    console.log("haha1");
});

5 执行:npm srart,运行结果如下

第一个electron的更多相关文章

  1. 打造你的第一个 Electron 应用

    Electron 可以让你使用纯 JavaScript 调用丰富的原生(操作系统) APIs 来创造桌面应用. 你可以把它看作一个 Node. js 的变体,它专注于桌面应用而不是 Web 服务器端. ...

  2. 一个Electron的设计缺陷及应对方案

    当你想实现阻止Electron窗口关闭,并弹出询问对话框,提示用户:"文章尚未保存,是否要关闭窗口"这类业务时,那么你99%会碰到这个BUG: https://github.com ...

  3. 自己实现一个Electron跨进程消息组件

    我们知道开发Electron应用,难免要涉及到跨进程通信,以前Electron内置了remote模块,极大的简化了跨进程通信的开发工作,但这也带来了很多问题,具体的细节请参与我之前写的文章: http ...

  4. 使用electron开发一个h5的客户端应用创建http服务模拟后台接口mock

    使用electron开发一个h5的客户端应用创建http服务模拟后端接口mock 在上一篇<electron快速开始>里讲述了如何快速的开始一个electron的应用程序,既然electr ...

  5. electron之Windows下使用 html js css 开发桌面应用程序

    1.atom/electron github: https://github.com/atom/electron 中文文档: https://github.com/atom/electron/tree ...

  6. electron打包发布

    1.全局安装electron npm install electron -g 在cmd 直接输入 electron 直接启electron 2.编写第一个Electron应用 在任何地方,建立一个ap ...

  7. 使用 AngularJS 和 Electron 构建桌面应用

    GitHub 的 Electron 框架(以前叫做 Atom Shell)允许你使用 HTML, CSS 和 JavaScript 编写跨平台的桌面应用.它是io.js 运行时的衍生,专注于桌面应用而 ...

  8. 使用Squirrel创建基于Electron开发的Windows 应用安装包

    我们把自己开发的Electron应用发布之前,需要把app打包成简单的安装包,这样app更容易被获取,以此来发布我们的应用.我们可以参考Wix或其他的安装程序,但是对于Electron应用更好的打包程 ...

  9. Electron(一)--初步了解并动手HelloWorld

    现在需要做一个桌面应用,心里有点不甘,因为想做出一个简单的客户端,你要么使用Java的Swing编程,要么会使用MFC等等,这样学习的代价太高,也不便维护,于是了解了一下Electron,Electr ...

随机推荐

  1. 织梦后台添加友情链接的方法(flink标签)

    标记名称:flink[标签简介][功能说明]:用于获取友情链接,其对应后台文件为"includetaglibflink.lib.php".[适用范围]:全局标记,适用V55,V56 ...

  2. C语言转置矩阵算法

    对一个nxn阶的矩阵进行转置,算法如下: #include <stdio.h> #define n 3 void MM(int a[][n]) { int i,j,temp; ;i < ...

  3. Perl学习笔记(3)----遍历哈希表的一个容易疏忽的地方

    今天做 Google的 Code Jam 上的一道题目:https://code.google.com/codejam/contest/351101/dashboard#s=p2,用Perl语言解答的 ...

  4. oozie安装总结

    偶然的机会,去面试的时候听面试官讲他们的调度系统是基于hue+oozie,以前一直没有接触过,今天趁有空,尝试一下oozie 1.环境说明 cat /etc/issue  CentOS release ...

  5. Javascript之全局变量和局部变量部分讲解

    以此文作为自己学习的一个总结. 关于全局变量和局部变量的一句简单的定义:在函数外声明的变量都为全局变量,在函数内声明的为局部变量. 一.局部变量和全局变量重名会覆盖全局变量 var a = 1; fu ...

  6. myeclipse 下载 checkstyle 引入后不显示问题

    参照这篇博客,http://blog.csdn.net/zzq900503/article/details/42003499 下载最新的checkstyle版本后,在本地导入后一直不显示,步骤什么的也 ...

  7. 如何一次性下载某个类库依赖的所有jar包"

    ** 经常碰到这种事情: ** 在一些非maven工程中(由于某种原因这种工程还是手工添加依赖的),需要用到某个新的类库(假设这个类库发布在maven库中),而这个类库又间接依赖很多其他类库,如果依赖 ...

  8. DevExpress源码编译总结 z

    本篇文章内容包括基础知识(GAC.程序集强签名.友元程序集).编译过程.注册GAC.添加工具箱.多语言支持.运行时和设计时调试 源码地址 链接:http://pan.baidu.com/s/1eQm1 ...

  9. Session跨域、Session共享、Mode=StateSever方式解决问题

    前言 很多童鞋在工作或面试的过程中,也许会遇到这样的问题,使用Session,怎样让多个站点实现Session共享的问题,也就是在A站点登录,那么在B站点就不需要重新登录了那?如果采用Session保 ...

  10. c# 的传递参数值传递与传递引用的区别,ref与out区别

    值传递 C#默认都是值传递的,就是复制变量的一个副本传递给方法,所以在退出方法后,对变量的修改无效. 但是要注意,当传递是引用类型时,因为引用类型是一个引用的地址,所以修改引用地址指向的对象时,一样会 ...