【极速系列】零基础制作windows软件 - exe套壳+url网站内容

效果图

 

需要准备

1. 可以访问的你的网站地址，例如 /
2. windows开发电脑一台
3. win安装编辑器fiddle /fiddle，如图
   
4. 点击fiddle左上角第三行的ELectron版本信息，选择下载非beta的版本下载，推荐v17.0.0
   
5. 如果下不动，证明被墙了，试试手机4G5G网络....

 

详细步骤

1. 打开Fiddle，即可看到默认创建好的一套代码，包括，等
2. 左上角File，Save as，另存为D:/app/demo/下
3. 修改为以下内容再保存，注意里面的网址要改改：

   
   
   
   // Modules to control application life and create native browser window
   
   
   
   
   const { app, BrowserWindow } = require('electron')
   
   
   
   
   const path = require('path')
   
   
   
    
   
   
   
   
   function createWindow () {
   
   
   
     // Create the browser window.
   
   
   
   
     const mainWindow = new BrowserWindow({
   
   
   
       width: 800,
   
   
   
       height: 600,
   
   
   
       webPreferences: {
   
   
   
         preload: path.join(__dirname, '')
   
   
   
       }
   
   
   
     })
   
   
   
    
   
   
   
     mainWindow.loadURL('/')
   
   
   
    
   
   
   
     // and load the  of the app.
   
   
   
   
     // ('')
   
   
   
   
    
   
   
   
     // Open the DevTools.
   
   
   
   
     // ()
   
   
   
   
   }
   
   
   
    
   
   
   
   // This method will be called when Electron has finished
   
   
   
   // initialization and is ready to create browser windows.
   
   
   
   // Some APIs can only be used after this event occurs.
   
   
   
   app.whenReady().then(() => {
   
   
   
     createWindow()
   
   
   
    
   
   
   
     app.on('activate', function () {
   
   
   
       // On macOS it's common to re-create a window in the app when the
   
   
   
   
       // dock icon is clicked and there are no other windows open.
   
   
   
   
       if (BrowserWindow.getAllWindows().length === 0) createWindow()
   
   
   
     })
   
   
   
   })
   
   
   
    
   
   
   
   // Quit when all windows are closed, except on macOS. There, it's common
   
   
   
   // for applications and their menu bar to stay active until the user quits
   
   
   
   // explicitly with Cmd + Q.
   
   
   
   app.on('window-all-closed', function () {
   
   
   
     if (process.platform !== 'darwin') app.quit()
   
   
   
   })
   
   
   
    
   
   
   
   // In this file you can include the rest of your app's specific main process
   
   
   
   // code. You can also put them in separate files and require them here.
   
   

4. 点击左上角的Run，即可看到效果，关闭弹出的程序
   
5. 【开始创建exe可执行文件】
   点击任务栏Tasks => Package Fiddle
   
   弹出控制台并显示进度，例如

   
   
   
   added 556 packages from 450 contributors in 46.72s
   
   
   
    
   
   
   
   55 packages are looking for funding
   
   
   
     run `npm fund` for details
   
   
   
   > testy-cap-eliminate-pqrwl@1.0.0 package C:\Users\mac\AppData\Local\Temp\tmp-30168-uEFoWEyz2LV0
   
   
   
   > electron-forge package
   
   
   
   ✅ Installers successfully created.
   
   

   可以看到程序已经部署到了 C:\Users\mac\AppData\Local\Temp\tmp-30168-uEFoWEyz2LV0，打开这个文件夹，可以找到里面的out文件夹的子目录，就是本软件的安装后的文件夹
   
   打包本文件夹即可获得桌面app
6. 里面的exe文件就是程序主入口
7. 至于为什么这么巨大，和怎么瘦身，还在研究中。。。

 

Good luck！