您的位置：首页 > 其它

electron环境搭建和使用

2020-02-29 21:24 302 查看
  • Electron 是由 Github开发的开源框架
  • 它允许开发者使用Web技术构建跨平台的桌面应用
  • Electron = Chromium + Node.js + Native API

首先要先去安装node环境

+ 官网地址：https://nodejs.org/zh-cn/

接下来开始安装Electron

cnpm install -g electron

这里已经要使用cnpm安装，如果想用npm安装会特别慢，除非翻墙

初始化一个项目

在你的桌面新建一个文件

  • 创建一个html文件
<!DOCTYPE html>
<html lang="en">

<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Document</title>
</head>

<body>
你好
</body>

</html>
  • 创建一个js文件
const electron = require('electron') //引入electron模块
var app = electron.app //创建electron引用
var BrowserWindow = electron.BrowserWindow; //创建窗口引用

var mainWindow = null; //声明要打开的主窗口
app.on('ready', () => {
mainWindow = new BrowserWindow({
width: 900,
height: 900
}) //设置窗口的大小
mainWindow.loadFile('index.html'); //要加载的文件

//监听关闭事件，在把主窗口设置位null

mainWindow.on('closed', () => {
mainWindow = null;
})
})
  • 写完后直接使用npm init --yes来初始化package.json文件

运行项目

直接在控制台输入

electron .

就可以打开了

已经就是electron环境搭建和使用

  • 点赞 1
  • 收藏
  • 分享
  • 文章举报
小周sri的码农 发布了66 篇原创文章 · 获赞 58 · 访问量 506 私信 关注
内容来自用户分享和网络整理，不保证内容的准确性，如有侵权内容，可联系管理员处理 点击这里给我发消息
标签： 
相关文章推荐
新的分享
章节导航