1、安装node.js

2、安装淘宝镜像

　　npm install -g cnpm --registry=https://registry.npm.taobao.org

3、安装全局electron

　　npm install -g electron

4、创建package.json文件

　　npm init

5、若全局安装，则忽视。局部安装命令

　　npm install --save-dev electron

6、package.json内容　　

{

  "name": "testapp",

  "version": "0.0.1",

  "description": "testapp",

  "main": "main.js",

  "dependencies": {},

  "devDependencies": {

    "electron": "^7.1.2",

    "electron-packager": "^14.1.1"

  },

  "scripts": {

    "start": "electron .",

    "packager": "electron-packager . haha --platform=win32 --arch=x64 --icon=icon.ico --out=./out --asar --app-version=0.0.1"

  },

  "author": "",

  "license": "ISC"

}

7、main.js内容

const {app, BrowserWindow} = require('electron')

const path = require('path')

const url = require('url')

let win

function createWindow () {

  win = new BrowserWindow({width: 800, height: 600})

  win.loadURL(url.format({

    pathname: path.join(__dirname, 'index.html'),

    protocol: 'file:',

    slashes: true

  }))

  win.on('closed', () => {

    win = null

  })

}

app.on('ready', createWindow)

app.on('window-all-closed', () => {

  if (process.platform !== 'darwin') {

    app.quit()

  }

})

app.on('activate', () => {

  if (win === null) {

    createWindow()

  }

})

8、index.html内容

<!DOCTYPE html>

<html>

  <head>

    <meta charset="UTF-8">

    <title>aaa</title>

    <meta http-equiv="Content-Security-Policy" content="script-src 'self' 'unsafe-inline';" />

  </head>

  <body >

    <input type="number" value="">

	  asdfads

    <h1>Hello World!</h1>

    We are using node <script>document.write(process.versions.node)</script>,

    Chrome <script>document.write(process.versions.chrome)</script>,

    and Electron <script>document.write(process.versions.electron)</script>.

  </body>

</html>

9、启动命令①

　　electron .

10、启动命令②

　　前提先安装局部依赖

　　npm install　　

　　npm start

11、安装electron-packager打包工具

　　npm install electron-packager -g

12、配置打包命令

  "scripts": {

    "start": "electron .",

    "packager": "electron-packager . haha --platform=win32 --arch=x64 --icon=icon.ico --out=./out --asar --app-version=0.0.1"

  }

13、启动打包

　　npm run packager

　　

　

　　

electron之环境安装、启动程序的更多相关文章

  1. Electron – 基础学习(1): 环境安装、创建项目及入门

    这几天到年底了,公司也没啥事,闲着就到处瞅瞅.记得上一家公司的时候用 Electron+ng1 写过项目,只是那个时候项目框架都是别人搭的,自己只负责写功能,对Electron没啥认识. 这几天想着反 ...

  2. php大力力 [002节]mac php环境安装，mamp安装 ，phpMyAdmin启动

    php大力力 [002节]mac php环境安装,mamp安装 ,phpMyAdmin启动 每个人机器不一样,我手头是个air book,查了一下现在最好在mac下,用mamp, mamp百科介绍 , ...

  3. Burp Suite安装&环境配置&启动&浏览器设置代理

    一.简述 Burp Suite是一款使用Java编写的,用于Web安全审计与扫描套件.它集成了诸多实用的小工具以完成http请求的转发/修改/扫描等,同时这些小工具之间还可以 互相协作,在BurpSu ...

  4. 【Cloud Computing】Hadoop环境安装、基本命令及MapReduce字数统计程序

    [Cloud Computing]Hadoop环境安装.基本命令及MapReduce字数统计程序 1.虚拟机准备 1.1 模板机器配置 1.1.1 主机配置 IP地址:在学校校园网Wifi下连接下 V ...

  5. OSX 10.10+Xcode5.1 无法启动或者安装应用程序到iOS 6.1 simulator

    错误症状: OSX 10.10+Xcode5.1 无法启动或者安装应用程序到iOS 6.1 simulator 错误原因: iOS Simulator 内核要使用OSX 系统内核,所以iOS Simu ...

  6. C# 制作Java +Mysql+Tomcat 环境安装程序，一键式安装

    原文:C# 制作Java +Mysql+Tomcat 环境安装程序,一键式安装 要求: JDK.Mysql.Tomcat三者制作成一个安装包, 不能单独安装,安装过程不显示三者的界面, 安装完成要配置 ...

  7. QTP 自动化测试桌面程序--笔记（关闭 启动程序脚本) 、安装

    0 安装qtp .exe 文件 安装 插件文件(如delph) 1 关闭 启动程序: 将要操作的程序-存入localdatatable中 设置 迭代一次 rem SystemUtil.ClosePro ...

  8. windows 环境下通过运行快速启动程序

    在windows环境下,我们可以使用一些系统内置的快捷键来快速启动我们想要的应用程序,我这里举例几个我经常使用的,比如: 快捷键 功能说明 services.msc  查看系统服务 gpedit.ms ...

  9. Ubuntu图形界面环境下启动应该程序:

    1.先说下Ubuntu14.04系统开机紫框的问题: Grub theme:黑色屏幕出现紫色边框 There's a minor typo on the grub theme which produc ...

随机推荐

  1. CSS属性margin、padding的区别

    原始状态 不设置margin和padding的状态 margin 设置外边距之后的状态 padding 设置内边距之后的状态 ,注意是撑开,外框高宽由300px变成450px. 说明:本文为原创作品, ...

  2. dubbo框架梳理

    Dubbo分层 Dubbo框架运行主要分如下九层: 配置层:config 服务代理层:proxy 注册中心层:registry 路由层:cluster 监控层:monitor 远程调用层:protoc ...

  3. SuperMemo method

    原文:https://www.supermemo.com/en/archives1990-2015/english/ol/sm2 别人的研究:http://wdxtub.lofter.com/post ...

  4. docker 部署 elasticsearch + elasticsearch-head + elasticsearch-head跨域问题 + IK分词器

    0.  docker pull 拉取elasticsearch + elasticsearch-head 镜像 1.  启动elasticsearch Docker镜像 docker run -di ...

  5. Linux常用命令及文件管理

    Linux上的文件管理类命令都有哪些,其常用的使用方法及其相关示例演示. 目录解释: .代表此层目录:  .. 代表父目录:-代表前一个目录:~代表是家目录. (1)ls命令(显示) -a:列出所有文 ...

  6. 查看python和NumPy版本和安装路径

    记录查看Python和NumPy版本以及路径的几条命令 # 查看Python版本及路径 python -V python -c "import sys;print(sys.executabl ...

  7. 深度解析Droupout与Batch Normalization

    Droupout与Batch Normalization都是深度学习常用且基础的训练技巧了.本文将从理论和实践两个角度分布其特点和细节. Droupout 2012年,Hinton在其论文中提出Dro ...

  8. Controllers返回View的一个完整流程

    详细说明一个MVC框架下,返回一个view的原理.如下图: 上图粗略的说明了一个返回View的流程,细节如下: 1.定义Model类: 2.定义接口添加接口约束为class: 3.定义接口实现类,即对 ...

  9. Reloading current route in Angular 5 / Angular 6 / Angular 7

    问题: angular 从子状态回到当前的父级状态的时候,父级状态不会重新初始化. https://github.com/angular-ui/ui-router/issues/2992 原文:htt ...

  10. Nginx中ngx_http_auth_basic_moudel和ngx_http_stub_status_module模块

    ngx_http_auth_basic_module实现基于⽤用户的访问控制,使⽤用basic机制进⾏行行⽤用户认证指令:5.1 auth_basicSyntax: auth_basic string ...