uniapp生成exe

UniApp 是一款非常受欢迎的跨平台应用开发框架,它允许开发者使用一套代码,同时构建出多个平台(如 iOS、Android、微信小程序)等的应用程序。但默认情况下,UniApp 不支持将应用打包成 Windows 或 macOS 平台上的 .exe 或 .dmg 文件。但我们确实可以实现这个需求,为了能生成 .exe,可以使用一个额外的框架 -- Electron。

Electron 是一个使用 JavaScript, HTML 和 CSS 构建跨平台桌面应用程序的开源框架。它基于 Chromium 和 Node.js,使得开发者可以将 Web 技术带到桌面,轻松构建 Windows、macOS 和 Linux 上运行的原生应用程序。

要实现 UniApp 生成 .exe 文件,可以遵循以下步骤:

1. 安装 Electron

在项目根目录,运行以下命令以安装 Electron:

```

npm install electron -D

```

2. 创建 "electron-main.js" 文件

在项目根目录创建一个名为 "electron-main.js" 的文件。这是 Electron 的主入口文件,粘贴以下内容:

```javascript

const { app, BrowserWindow } = require("electron");

function createWindow() {

const win = new BrowserWindow({

width: 800,

height: 600,

webPreferences: {

nodeIntegration: true,

},

});

win.loadURL("http://localhost:8080/"); // 加载uni-app的url

}

app.whenReady().then(createWindow);

app.on("window-all-closed", () => {

if (process.platform !== "darwin") {

app.quit();

}

});

app.on("activate", () => {

if (BrowserWindow.getAllWindows().length === 0) {

createWindow();

}

});

```

3. 修改 "package.json"

打开项目根目录下的 "package.json" 文件,添加以下内容:

```json

"main": "electron-main.js",

"scripts": {

"electron": "npm run build && electron ."

}

```

这将添加一个新的命令行脚本 "electron",用于启动应用程序。

4. 编译项目并运行

在项目根目录下运行以下命令,您的应用将以桌面程序的形式启动:

```

npm run electron

```

5. 打包成 .exe 文件

要将 Electron 应用程序打包成可执行的 .exe 文件,可以使用像 electron-builder、electron-packager 等打包工具。这里我们以 electron-builder 为例。

您需要先安装 electron-builder:

```

npm install electron-builder -D

```

然后,在 "package.json" 文件中添加以下内容,以配置 electron-builder:

```json

"build": {

"productName": "MyUniApp",

"appId": "com.example.myuniapp",

"files": ["electron-main.js"],

"directories": {

"output": "build"

},

"win": {

"target": ["nsis"]

}

}

```

现在,您可以运行以下命令来打包应用:

```

npm run build && electron-builder

```

完成后,您会在项目目录的 "build" 文件夹中找到生成的.exe文件。

通过以上步骤,您已经成功将 UniApp 项目转换为一个基于 Electron 的桌面应用程序,并生成 .exe 文件。这个过程可以为希望将 Web 应用推向桌面的开发者节省大量时间和精力,同时又不损害原有多平台应用的能力。