学习electron(2)-加载js脚本,打包

1.app 监听生命周期

	app.on('window-all-closed', () => {
	  if (process.platform !== 'darwin') app.quit()
	})
	app.on('activate', () => {
	    if (BrowserWindow.getAllWindows().length === 0) createWindow()
	  })

2.加载js脚本

2.1创建一个proload.js
window.addEventListener('DOMContentLoaded', () => {
  const replaceText = (selector, text) => {
    const element = document.getElementById(selector)
    if (element) element.innerText = text
  }

  for (const dependency of ['chrome', 'node', 'electron']) {
    replaceText(`${dependency}-version`, process.versions[dependency])
  }
})

2.2 在main.js中引入proload.js

// include the Node.js 'path' module at the top of your file
const path = require('path')

// modify your existing createWindow() function
const createWindow = () => {
  const win = new BrowserWindow({
    width: 800,
    height: 600,
    webPreferences: {
      preload: path.join(__dirname, 'preload.js')
    }
  })

  win.loadFile('index.html')
}
__dirname 字符串指向当前正在执行脚本的路径 (在本例中,它指向你的项目的根文件夹)。
path.join API 将多个路径联结在一起,创建一个跨平台的路径字符串。
2.3 重启项目,获得process中的版本信息 ![在这里插入图片描述](https://img-blog.csdnimg.cn/1897bac5ba804275bbcf3046c09392f4.png)

3.打包

3.1使用Electron Forge ,安装并 import 设置脚手架

npm install --save-dev @electron-forge/cli
npx electron-forge import

结果如下
在这里插入图片描述
此时的package.json
在这里插入图片描述

3.3使用 forge 的make指令打包

	npm run make

在这里插入图片描述
最终生成out 文件,软件包在里面

评论 1
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值