如何将含HTML、JS、CSS的jQuery抽奖网页打包为.exe可执行程序？

下面提供几种实用方案，从快速实现到自定义配置都有覆盖：

方案1：用Nativefier快速打包（适合快速出结果） #

Nativefier是基于Electron的工具，能一键把本地HTML项目打包成桌面应用：

• 先安装Node.js（自带npm包管理器）
• 打开命令行，全局安装Nativefier：npm install -g nativefier
• 进入jquery-app所在的上级目录，执行命令：
  nativefier --name "抽奖Demo" ./jquery-app
• 执行完成后会生成一个带.exe的文件夹，里面的.exe就是可直接运行的程序。

方案2：用Electron手动打包（适合自定义窗口、图标等） #

如果需要自定义窗口大小、应用图标或启动逻辑，用Electron更灵活：

1. 初始化项目：
   • 进入jquery-app文件夹，执行npm init -y生成package.json
   • 安装Electron依赖：npm install electron --save-dev
2. 在jquery-app根目录新建main.js，写入以下代码：

   const { app, BrowserWindow } = require('electron');
   const path = require('path');
   
   function createWindow() {
     // 创建应用窗口，可自定义宽高
     const mainWindow = new BrowserWindow({
       width: 800,
       height: 600,
       webPreferences: {
         nodeIntegration: true,
         contextIsolation: false
       }
     });
   
     // 加载本地的index.html文件
     mainWindow.loadFile(path.join(__dirname, 'index.html'));
   
     // 调试阶段可打开开发者工具，正式打包前注释掉
     // mainWindow.webContents.openDevTools();
   }
   
   // Electron应用启动逻辑
   app.whenReady().then(() => {
     createWindow();
     app.on('activate', () => {
       if (BrowserWindow.getAllWindows().length === 0) createWindow();
     });
   });
   
   app.on('window-all-closed', () => {
     if (process.platform !== 'darwin') app.quit();
   });
   

3. 修改package.json里的scripts字段，添加启动和打包命令：

   "scripts": {
     "start": "electron .",
     "package": "electron-packager . 抽奖Demo --platform=win32 --arch=x64 --out=dist"
   }
   

4. 先测试运行：npm start，确认抽奖功能正常后，执行打包命令：npm run package
5. 打包完成后，dist文件夹里会出现包含.exe的应用目录。

方案3：合并成单个.exe（可选） #

如果想要生成单个独立的.exe文件，可在上面两种方法生成.exe后，用Enigma Virtual Box处理：

• 下载Enigma Virtual Box（免费工具）
• 打开工具，选择生成的.exe作为“主文件”
• 将jquery-app内的所有文件（css、images、js、index.html）添加到“文件列表”
• 点击“封包”，即可得到单个无需依赖的.exe。

内容的提问来源于stack exchange，提问作者Jeamy