electron使用

Electron使用

  • 1.下载官方dome;
  • 2.打包成桌面应用;
  • 3.将.exe文件打包成安装包;

1.下载官方dome;

# 克隆这仓库
git clone https://github.com/electron/electron-quick-start
# 进入仓库
cd electron-quick-start
# 安装依赖库
npm install
# 运行应用
npm start

2.打包成桌面应用;


//1 安装打包工具,此处安装出问题,需要修改npm 配置文件,详情见下;
npm install electron-packager --save-dev


//2 在package.json 的scripts中 增加启动命令;
"electron-build": "electron-packager ./ --platform=win32 --arch=x64 --overwrite"


//3 运行 会在项目生成一个文件夹,里面有.exe 文件;
npm run electron-build

第一步安装不成功处理如下;
1. 打开cmd ,输入 npm config edit ;
2. 弹出的文件 中添加 如下代码,保存;

registry=https://registry.npm.taobao.org
sass_binary_site=https://npm.taobao.org/mirrors/node-sass/
phantomjs_cdnurl=http://npm.taobao.org/mirrors/phantomjs
electron_mirror=http://npm.taobao.org/mirrors/electron/

3.删除node-modules ,从新下载包

第二步的命令语法 :
electron-packager <资源路径> <打包出的exe名称> –platform=<平台名称> –arch= [配置项选填,可以设置二进制打包等,默认没有这些]

  1. sourcedir 资源路径,在本例中既是./

  2. appname 打包出的exe名称

  3. platform 平台名称(windows是win32)

  4. arch 版本,本例为x64

  5. [optional flags…] 配置项选填,可以设置二进制打包等,默认没有这些

3.将.exe文件打包成安装包;

链接:https://www.cnblogs.com/kakayang/p/9559777.html

//添加了 打开 最大化,去掉导航栏

//模块来控制应用程序生命周期和创建本地浏览器窗口
const { app, BrowserWindow } = require('electron')
const path = require('path')

function createWindow() {

  //创建浏览器窗口。
  const mainWindow = new BrowserWindow({
    // frame: false,
    // width: 1200,
    // height: 600,
    show: false,
    webPreferences: {
      preload: path.join(__dirname, 'preload.js')
    }
  })
  //打开就是最大化;
  mainWindow.maximize()
  mainWindow.show()


  //并加载应用程序的index.html。
  // mainWindow.loadFile('index.html')
  mainWindow.loadURL('http://192.168.88.220:8000/#/') // 方法三

  //打开开发工具。
  // mainWindow.webContents.openDevTools()
}

//当Electron完成时,将调用此方法
//初始化,准备创建浏览器窗口。
//有些api只能在事件发生后使用。
app.whenReady().then(() => {
  createWindow()
  // 隐藏菜单栏
  const { Menu } = require('electron');
  Menu.setApplicationMenu(null);
  app.on('activate', function () {
    //在macOS上,当
    // dock图标被点击,没有其他窗口打开。
    if (BrowserWindow.getAllWindows().length === 0) createWindow()
  })
})

//关闭所有窗口后退出。
app.on('window-all-closed', function () {
  //在macOS上,应用程序及其菜单栏是很常见的
  //保持活动状态,直到用户明确退出Cmd + Q
  if (process.platform !== 'darwin') app.quit()
})

//在这个文件中,可以包含应用程序的其他特定主进程
//代码。您还可以将它们放在单独的文件中,并在这里需要它们。

Inno Setup 打包程序汉化教程:https://www.cnblogs.com/liancs/archive/2012/09/14/2685061.html
Inno Setup 官网汉化包:http://www.jrsoftware.org/files/istrans/ (需)

你可能感兴趣的:(vue)