资源描述
单击此处编辑母版标题样式,单击此处编辑母版文本样式,第二级,第三级,第四级,第五级,*,*,electron,环境安装,第一步安装,Node.js,然后使用,NPM,全局安装,electron,npm i electron-g,Quick start,项目大致的文件结构如右图所示,package.json,是,node,项目的配置文件,main.js,是,electron,的入口,index.html,就是应用的文件,package.json,name :your-app,/,应用名称,version:0.1.0,/,版本号,main :main.js /electron,的入口文件,const app,BrowserWindow=require(electron),let win,function createWindow(),win=new BrowserWindow(width:800,height:600),/Create the browser window.,win.loadURL(file:/$_dirname/html/login.html)/and load the index.html of the app.,win.webContents.openDevTools(),/Open the DevTools.,win.on(closed,()=win=null),app.on(ready,createWindow),app.on(window-all-closed,()=,/On macOS it is common for applications and their menu bar,/to stay active until the user quits explicitly with Cmd+Q,if(process.platform!=darwin),app.quit(),),app.on(activate,()=,/On macOS its common to re-create a window in the app when the,/dock icon is clicked and there are no other windows open.,if(win=null),createWindow(),),Hello World!,Hello World!,We are using node document.write(process.versions.node),Chrome document.write(process.versions.chrome),and Electron document.write(process.versions.electron).,运行,用,CMD,转到项目文件下运行,electron.,electron,和,jquery,冲突解决方案,1,手动导入,$,window.$=window.jQuery=require(jquery.js);,2,在导入前后添加代码,if(typeof module=object)window.module=module;module=undefined;,if(window.module)module=window.module;,使用,node,拓展,以,Serialport,为例,在项目下运行,npm install Serialport-save-dev,在,JS,中直接调用,var SerialPort=require(serialport);,SerialPort.list(err,ports)=,ports.forEach(port)=,console.log(Name);,),);,由于,serialport,是依赖,C,的插件，所以没有以,electron,版本编译会报错,首先全局安装,node-gyp,npm install node-gyp-g,转到,serialport,目录下,cd node_modules/serialport,然后编译,node-gyp rebuild-target=1.4.6-arch=ia32-dist-url=https:/atom.io/download/atom-shell,打包,使用,electron-packager,来打包,electron-packager./app HelloWorld-out./OutApp-platform=win32-arch=ia32-electron-version=1.4.6,-asar,参数分别是,项目路径 项目名称 输出路径 操作系统 操作系统位数,electron,版本,
展开阅读全文