[Solved] electron Package and Startup Error: Error: ENOENT: no such file or directory, open ‘xxx/manifest.json‘‘

Start the error report after packaging with electron-builder:

Reading /xxx/manifest.json failed.
Error: ENOENT: no such file or directory, open '/xxx/manifest.json'
    at Object.fs.openSync (fs.js:558:18)
    at Object.module.(anonymous function) [as openSync] (ELECTRON_ASAR.js:173:20)
    at Object.fs.readFileSync (fs.js:468:33)
    at Object.fs.readFileSync (ELECTRON_ASAR.js:506:29)
    at getManifestFromPath (/xxx/node_modules/electron/dist/Electron.app/Contents/Resources/electron.asar/browser/chrome-extension.js:34:26)
    at Function.BrowserWindow.addDevToolsExtension (/xxx/node_modules/electron/dist/Electron.app/Contents/Resources/electron.asar/browser/chrome-extension.js:373:22)
    at App.Z.enabled.X.on (/xxx/webpack:/~/electron-debug/index.js:78:1)
    at emitTwo (events.js:111:20)
    at App.emit (events.js:191:7)

Solution:

1. Execute the following command:

npm install vue-devtools --global

2. Modify src/main/index.dev.js as follows:

import {  BrowserWindow } from 'electron'; //Add
/* eslint-disable */

// Install `electron-debug` with `devtron`
// require('electron-debug')({ showDevTools: true })
require('electron-debug')() //Modify

// Install `vue-devtools`
require('electron').app.on('ready', () => {
  let installExtension = require('electron-devtools-installer')
  //Comment out
  // installExtension.default(installExtension.VUEJS_DEVTOOLS)
  //   .then(() => {})
  //   .catch(err => {
  //     console.log('Unable to install `vue-devtools`: \n', err)
  //   })
  //Add
  BrowserWindow.addDevToolsExtension('node_modules/vue-devtools/vender')
})
// Require `main` process to boot app
require('./index')

3. Recompile:

npm run build:win32

4. Repackage:

electron-builder

It can start normally:

Read More: