说明
electron 是用前端的技术写Windows macos linux 上可安装软件的技术,是前端人员扩充自己技术体系的已个高大上的技术,它可以结合现在主流的前端框架vue,react,anglar,构建桌面应用,也可以像写jquery项目一样写桌面应用,现在我就写个简单的hellow word!
第一步
创建一个项目文件夹,(不要用中文!不要有空格!)
第二步
npm init -y //生成一个package.json 来管理这个项目
{
"name": "demo04",
"version": "1.0.0",
"description": "",
"main": "index.js",
"scripts": {
"test": "echo \"Error: no test specified\" && exit 1"
},
"keywords": [],
"author": "",
"license": "ISC"
}
项目默认以index.js 为主入口,(可以自己修改)你就创建一个index的js文件
第三步
安装electron npm i electron --save 这一步很困难,因为资源在国外,安装很慢,而且很容易安装失败,我就把我安装好的依赖传到我公司svn服务器,供大家下载,http://s.tronl.cn/weixin/node_modules.rar
第四步
在项目中创建一个index.html,里面随便写点内容
第五步
在main.js里敲入下面代码
const {app,BrowserWindow}=require('electron')
var win=null //这个一定要是全局变量,避免js垃圾回收机制回收了
app.on('ready',()=>{
win=new BrowserWindow({
width:300,
height:900
})
win.loadFile('index.html')
})
app.on('closed',()=>{
win=null
})
第六步
执行命令electron .这是让你项目跑起来,然后它会给你打开你的软件
也可以自己配置一个喜欢的命令 ,比如我习惯用vue ,就可以配置一个 npm run dev