【electron】打包过程中的一些坑

1.应用白屏

本地运行正常，打包后白屏，大概率是loadFile路径不对

其中index.html的路径要根据打包后的main.js的相对路径，打包后main.js的层级变了，需要对应修改，renderer和main的目录是并列的

win.loadFile(path.join(__dirname, '../../renderer/index.html'));

2. 整个应用打包后找不到main.js文件

⨯ Application entry file "main/main.js" in the "xx/Contents/Resources/app.asar" does not exist. Seems like a wrong configuration.  stackTrace=

网上很多答案说的是extends 设置为null，但是打包后依旧有其他问题，这里是在

electron.builder.json中 设置main.js的路径，因为打包后main.js放到了src下面，并不是直接放在了dist文件下，所以这里需要将完整路径写上，第一层的main目录表示的是打包后的dist文件

  "extraMetadata": {
    "main": "main/src/main.js"
  }

3.react项目中渲染进程中引用node模块内容，如fs模块，remote，children_progress等运行时报错 

原因：渲染进程相当于我们的浏览器，在浏览器中不能直接使用这些需要在服务端运行的模块，直接调用将报错

Uncaught TypeError: fs.existsSync is not a function at getElectronPath (index.js:8)

修改引用方式，如

const { writeFile, rmdirsync } = window.require('fs');

 

4. 在渲染进程中引用一些node模块的内容，打包后找不到对应模块，如

const adm_zip = window.require('adm-zip');

从渲染进程的引入方式可以知道， 渲染进程中并没有这个模块，我们是从主进程中引入的，执行也是在主进程中执行，所以包的引入需要放在主进程的package.json中，否则会出错