奋斗了一个月，发了无数帖子，终于放弃了nw.js，拥抱了electron。事实证明我是对的，electron居然有中文文档，而且还有官方的例子，不要太cool！一、Electron基础知识1、主要渲染流程先来看一下Electron的入口示例，//引入Electron模块constelectron=require('electron');//控制应用的生命周期，将各种状态绑定到app的Events上，控制生命周期constapp=electron.app;//控制本机浏览器窗口constBrowserWindow=electron.BrowserWindow;//路径路径管理模块constpath=require('path');//url管理模块consturl=require('url');//与渲染进程通信的ipc模块constipc=require('electron').ipcMain;//永久保存window对象的引用，否则会被对象垃圾回收，应用程序会关闭letmainWindow;//生成一个浏览器窗口functioncreateWindow(){//使用new一个BrowserWindow对象实例得到一个新窗口，因为在mainWindow之外引用不会被淘汰=newBrowserWindow({width:1000,height:750,resizable:true,框架:真});//内核还是一个网页，所以打开网页mainWindow.loadURL(url.format({pathname:path.join(__dirname,'index.html'),protocol:'file:',slashes:true}));//启用开发者工具//mainWindow.webContents.openDevTools()//设置窗口关闭事件的回调函数，使这个实例为空mainWindow。on('closed',function(){//如果应用支持多窗口，则应将多个窗口对象管理在一个数组中，同时删除对应的元素mainWindow=null;});//renderingProcess发来消息，请你关闭app！ipc.on('exitWindow',function(){mainWindow.close();});}//设置窗口准备回调，创建窗口后执行该函数app.on('ready',createWindow);//绑定所有窗口关闭时的回调。和上面不同的是，上面只是销毁对应的window对象，这里会彻底退出app.on('window-all-closed',function(){if(process.platform!=='darwin'){quit();}});//设置点击图标打开新窗口的回调app.on('activate',function(){if(mainWindow===null){createWindow();}});说明：我也想了半天主进程和渲染进程是什么？什么关系？我的粗略理解：不是主进程main.js，而是程序的入口。它是运行在节点上的东西，负责调用electron的相应模块，将你的应用从html构建到桌面应用，比如里面的newBrowserWindow就是新建一个窗口，但是真正的界面是什么，点击界面上各种div的事件不是他管的，但是这个应用的放大缩小，启动关闭，原生菜单栏，打开的文件窗口都是他管的，渲染过程无法管理。试想一下，如果网页可以随意控制这个应用的关闭和打开，那岂不是很危险？渲染进程改用index.js，其实就是网页引用的js文件。可以大致理解为运行在浏览器上，名字不同，但是因为是桌面应用，所以可以打开很多Page，这里也可以有很多渲染进程，index.js中可以使用node模块，比如fs.readdir('av......',(err,data)=>{if(err){alert('啊，电影不见了');}});如果文件读取错误，可以直接报警！这不是很酷！相关API可以参考https://github.com/electron/e...很详细！有了基础知识，就可以开始搭建开发环境了。2.环境搭建sf的教程比较老，现在没有npminstallelectron-prebuilt，直接npminstallelectron-g，安装到develop目录下即可。在这里，新手在本地目录不用自己安装，使用官方的示例代码，然后就可以看到我之前给的main.js了，可以改成html自己创建应用，因为ide是不是很跳页面很简单，里面没有什么技术含量，但是可以让你快速上手electron的配置，所以说一下。$gitclonehttps://github.com/electron/electron-quick-start//下载官方示例代码$cdelectron-quick-start$npminstall&&npmstart//这样就安装好了运行！如果你想使用jquery、jq插件等，请看这里！！！！window.nodeRequire=require;deletewindow.require;deletewindow.exports;deletewindow.module;在html最上面用script引入这段代码，以后用nodeRequire代替node的require，因为require,module等。一直挂在Inwindow，会和jquery冲突。在webpack中尽量使用import引入模块而不是require，否则会产生冲突。到目前为止我还没有找到解决方案。.....varwebpack=require("webpack");varpath=require("path");varpathMap=require('./src/pathmap.json');varsrcDir=path.resolve(process.cwd(),'src');varnodeModPath=path.resolve(__dirname,'./node_modules');module.exports={entry:{index:"./src/js/index.js"},//入口js,可以数组输出：{path:path.join(__dirname,"src/dist"),filename:"[name]pack.js"},module:{loaders:[{test:/\.scss$/,loader:'style-loader!css-loader!sass-loader'},{test:/\.css$/,loader:'style-loader!css-loader'}],},resolve:{扩展名:['.js',"",".css",".scss"],//表示那些文件名是webpack要扫描的root:[srcDir,nodeModPath],alias:pathMap,publicPath:'/'},}webpack.config没什么异常，就是配上了avalon和sass-loader的路径注意如果要用scss也是sass-loader，尽量用cnpm解决node-sass的坑，配置我就不说了webpack启动发达！其实就是传统的写网页的方式，但是可以加入node，是不是很爽！
