给新手的最简单electron使用教程

我花了两个月闲暇翻译完了文档,大概是目前最完整最实时的中文文档了,有须要能够去看看学学:github传送门,大多数的需求阅读文档便可解决,实际上,翻译文档正是我入门一项未知事物时的最简单经常使用的法子.

electron其实很方便,不过对于刚接触的前端而言学起来可能比较麻烦,由于很多都须要命令行来.
这是篇简单的入门教程,省略了诸多步骤,只纯粹了解win下的electron使用前提,安装方法,使用教程,打包四个环节.

---

Electron安装方法:
因为上文中传送门里的文档已经很是简便的阐明安装方法,极其之简单,这里再也不重复.须要的同窗可前往阅读.

---

线上打包:
不少朋友都是web站好了再利用electron作个壳子给客户,这样就免了启动浏览器.
想法是好的,但思路是不太应该的.
由于它自己带的api仍是很不错的,你应该按着electron构建你的web,这样才是更聪明的办法.
恰恰明知不聪明,咱们就有这样的需求时:

打开c:/electron-quick-start/,咱们只要这几个文件,其他删了.
    .git
    node_modules
    .gitignore
    main.js
    package.json
    找到createWindow()修改为如下:

function createWindow () {
  mainWindow = new BrowserWindow({width: 1200, height: 800,frame: false })
  mainWindow.loadURL('http://www.baidu.com')
  mainWindow.on('closed', function () {
    mainWindow = null
  })
}

---

进行打包:

打包以前,运行cmd,输入npm install -g electron-packager
cd c:/electron-quick-start
c:/electron-quick-start/>electron-packager ./ --platform=win32 --arch=ia32
这样c:/electron-quick-start下就多了个程序目录,修改图标和程序名就是你的第一个exe应用了.

对于新手而言,就这么简单的进行了一次尝试.接下来你只要专心学习它的API,一定能开发出更强大的应用.这就是这篇教程的意义.若是你在开发时遇到一些自觉文档没法说起的需求能够在上文传送门中提出,我如有空大部分状况下会为你作出解决方案,事实上在介绍页中已列出了不少小例子.