前言:

Electron中文文档! 精心翻译,完美排版,实时同步更新! (本文档未经同意不得传播!) , 最后同步:2017-05-23

QQ交流群:

  • 群名称:Electron/Nw.js开发交流群
  • 群 号:535260421
  • 创 建:2017-05-19
  • 宗 旨:严禁广告,仅为Electron/Nw.js应用开发交流,译者群主将不定期分享DEMO文件给大家交流学习使用.

群内DEMO文件教程列表:

  1. 001自定义托盘菜单界面.zip

image

  1. 002迅雷悬浮窗右键快捷菜单.zip

image

  1. 003渲染进程内实时在线或离线提示.zip

image

  1. 004系统托盘闪烁图标提示用户示例.zip

image

延伸拓展:

如果API中所列功能无法满足你的需求时,chrome-app-samples是你最好的选择.

多平台支持:

众所周知,目前的Electron主要支持桌面版系统的跨平台,例如Win,Linux,MacOS.并不支持(未来可能也不会支持)移动端如Android,iOS等.

相对而言,Electron的门槛非常低,仅需掌握少量Web语言即可入门,但是更多人的需求是:'Write once, run anywhere'(一次撰写,多端运行).

比如,对中国用户而言,Win+Android+iOS三平台支持就是最大的需求主流.

所以此处列举了常见的跨平台开发工具,也欢迎大家推荐更多优秀工具:

原生应用

  • React-Native - 作者Facebook,Javascript/React,目标平台:iOS/Android
  • nativescript - JavaScript,目标平台:iOS/Android/Windows
  • CrossAPP - C++,目标平台:iOS/Android
  • Xamarin - C#,目标平台:iOS/Android/Windows/Mac
  • QT - C++,Android/iOS/Windows 10 Mobile/BlackBerry 10/Ubuntu/Sailfish
  • JUniversal - Java,目标平台:iOS/Android
  • Kivy -Python,目标平台:iOS/Android/Windows/Mac/Linux
  • Weex - 作者阿里巴巴,Web,目标平台:iOS/Android
  • Flutter - 作者谷歌团队,目标平台:iOS/Android

混合应用

更多选择

除了上方列举的开发工具之外,你还可以在这个页面上看到更多的工具并欣赏用它们开发的作品截图.

Electron通用安装(第一二步请选择适合自己的系统):

  • 1.Node.js安装
  • 2.git安装
  • 3.开始菜单中运行cmd或终端中,粘贴下方命令: 没有翻墙VPN的同学使用:
    npm install cnpm -g --registry=http://registry.npm.taobao.org
    cnpm install electron -g
    
    可翻墙的同学使用:
    npm install electron -g
    

没有error错误提示的话,这样就安装完成了

你可以在cmd或终端中输入命令 electron -v 如果出来个版本号就可以了.

  • 4.创建demo应用:将quick-start目录中的四个文件放到任意目录,点击 start.bat,弹出 安装成功啦!提示,即创建成功.

注意:quick-start目录为示范文件,你可以任意修改.

  • 5.electron 常用的npm命令:
    安装:npm install electron -g 
    升级:npm update electron -g
    卸载:npm uninstall electron -g
    

Electron学习要点:

  1. 由于Electron基于Node.js,对于新手而言,入门第一关应当稍微熟悉Node.js的文档.

特别是如os,path等常用模块化的引用,这是非常必要的.

  1. Electron文档的学习,本文档中的方法,属性等列举的非常明细,它们的使用方法,你只需稍微观察quick-start目录即可明白.

只有一点,你需要特别的记住,Electron分为主进程和渲染进程,这两个进程的概念贯穿全程!

当你遇到需求进行查阅文档时,你需要先判断所属进程,再判断功能区域,这样即可确定API所在章节,例如,调用系统打印机进行打印小票:

  • 调用系统打印机(与系统交互类的多数为主进程)

  • 打印内容发生在页面内容即功能区域为webcontents(网页内容章节)

  • API需求为打印,搜 print(打印窗口页面)

常见问题:

提交issue前(欢迎提出各种自己想做但不知如何实现的需求),请详读以下常见问题:

兼容注意:

  • 与Jquery等第三方js插件的兼容相关
    <script src=`jquery.min.js`></script>
    <script>if (typeof module === 'object') {window.jQuery = window.$ = module.exports;};</script>
    

开发指南目录:

教程目录:

API接口目录:

公用:

主进程:

渲染进程:

API中的结构列表:

results matching ""

    No results matching ""