electron 简单 demo 并打包 linux
main.js
const { app, BrowserWindow } = require('electron')
function createWindow () {
// 创建浏览器窗口
let win = new BrowserWindow({
width: 800,
height: 600,
webPreferences: {
nodeIntegration: true
}
})
// 加载index.html文件
win.loadFile('index.html')
}
app.whenReady().then(createWindow)
index.html
DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>Hello World!title>
head>
<body>
<h1>Hello World!h1>
We are using node
<script>document.write(process.versions.node)script>
,
Chrome
<script>document.write(process.versions.chrome)script>
,
and Electron
<script>document.write(process.versions.electron)script>
.
and Electron
<button onclick="log()">clickbutton>
<img src="./assets/111.png" alt="">
<script>
function log() {
alert(1);
}
window.onload = () => {
document.addEventListener('keydown', function (e) {
if (e.keyCode == 86 && e.ctrlKey) {
alert("你按下了ctrl+V");
}
});
}
script>
body>
html>
package.json
{ "name": "electron-quick-start", "description": "A minimal Electron application", "version": "1.0.0", "main": "main.js", "scripts": { "start": "electron .", "package": "electron-packager . demo --platform=linux --arch=x64 --out=./dist --asar --app-version=1.0.0 --electron-version=18.2.2 --overwrite -no-sandbox --download.mirrorOptions.mirror=https://npm.taobao.org/mirrors/electron/", "package2": "electron-packager . demo --platform=linux --arch=ia32 --out=./dist --asar --app-version=1.0.0 --electron-version=18.2.2 --overwrite -no-sandbox --download.mirrorOptions.mirror=https://npm.taobao.org/mirrors/electron/", "package3": "electron-packager ./ helloworld --platform=linux --arch=x64 --out=./app --app-version=1.0.0 --electron-version=1.6.11 --overwrite --icon=./myicon.ico" }, "license": "CC0-1.0", "dependencies": { "electron": "^18.2.2", "electron-packager": "^15.5.1" }, "devDependencies": { "electron": "^18.2.2" } }
npm install 安装依赖后，npm start 可查看启动效果
文件结构记录：
