当前位置: 首页>后端>正文

node编写桌面程序-入门笔记

node编写桌面软件主要用的是 electron

// 程序
// 利用 electron 封装程序 【需要全局安装】
// npm install -g electron

// 依赖 electron-prebuilt,electron-builder,
// npm install -g electron-prebuilt
// npm install electron-builder -g

// 发布工具 packager
// npm install -g electron-packager
// 打包工具 asar (把用户数据打包成asar文件,无法直接查看源码)
// npm install -g asar

// 预览 可以用: electron .
//: npm run package

// 打包【这里已经直接应用了asar包装用户文件,程序文件无法查看源码】。打包有时候会报错,基本上多试几下都会好
// 【全局安装完electron 和 electron-packager 之后,当前文件还需要再安装electron (npm install electron -D)才能打包,不知道为什么】
// electron-packager . HelloWorld --platform=win32 --arch=x64 --icon=computer.ico --out=./out --asar --app-version=0.0.1 --overwrite --ignore=node_modules
// . 是指要打包的文件夹 这里是当前,
// HelloWorld 是输出的文件名
// platform是应用平台 win32 macOS linux
// arch 是
// icon 是打包的图标,必须是标准的ico 256*256的
// out 是输出到哪个目录下
// overwrite 如果已有同名包覆盖
// ignore 资源不包括,如果是多个资源就写多个 --ignore=datas --ignore=node_modules
// asar 使用asar打包用户资源
// 【执行打包】前需要配置环境变量;上边名称 下边值
// ELECTRON_MIRROR
// https://cdn.npm.taobao.org/dist/electron/

以下是完整的可打包程序实例

const {BrowserWindow, app} = require('electron')
const path = require('path')
const Url = require('url')
const fs = require('fs')

// 保存窗口的全局引用。否则当js对象被回收时,window可能会被关闭
let win = null

function createWindow () {
  win = new BrowserWindow({width: 800, hegiht:600, autoHideMenuBar: true})
  // win.setMenu(null)
  win.loadURL(Url.format({
    pathname: path.join(__dirname, 'page/index.html'),
    protocol: 'file', 
    slashes: true,
  }))
// 打开开发工具
  win.webContents.openDevTools()

  win.on('closed', () => {
    // 关闭窗口,销毁窗口引用,如果你使用了多个窗口,需要关闭响应的窗口
    win = null
  }) 
}

app.on('activate', () => {
  if (win == null) {
    createWindow()
  } else {
    win.show()
  }
})
app.on('ready', createWindow)

app.on('window-all-closed', () => {
  // macOS上多用得是应用程序??菜单栏, 用cmd + Q 退出
  if (process.platform != 'darwin') {
    server = null
    app.quit()
  }
})

以下是package.json文件内容,里边有需要配置的项 ;【注意】使用的插件要防盗【dependencies】里,否则打包完成会找不到

{
  'name': 'mylongexe',
  'version': '1.0.0',
  'description': '',
  'main': 'index.js',
  'scripts': {
    'serve': 'electron .',
    'build': 'electron-packager . mypro --platform=win32 --arch=x64 --icon=icon.ico --out=./out --asar --app-version=0.0.1 --overwrite --ignore=node_modules',
    'test': 'echo 'Error: no test specified' && exit 1'
  },
  'repository': {
    'type': 'git',
    'url': 'https://gitee.com/aiyaqiya/my-exe.git'
  },
  'author': '',
  'license': 'ISC',
  'devDependencies': {
    'aser': '^1.0.0',
    'electron': '^16.0.4',
    'electron-builder': '^22.14.5',
    'electron-packager': '^15.4.0',
    'electron-prebuilt': '^1.4.13'
  },
  'build': {
    'appId': 'com.bai.play',
    'copyright': 'Abai',
    'productName': 'Computed',
    'dmg': {
      'window': {
        'x': 100,
        'y': 100,
        'width': 800,
        'height': 500
      }
    },
    'win': {
      'icon': 'icon.ico'
    }
  }
},
'dependencies': {
    'electron': '^16.0.4',
    'koa': '^2.13.4',
    'koa-bodyparser': '^4.3.0',
    'koa-router': '^10.1.1'
  }

常用的electron API

electron 监听用户输入


https://www.xamrdz.com/backend/3vf1941653.html

相关文章: