vue-cli-plugin-electron-builder: fs.existsSync is not a function

Describe the bug I’m getting fs.existsSync is not a function when I’m importing electron in my component. This is similar to #335 but the solution is not working for me.

To Reproduce

import { remote } from 'electron';

const { app } = remote

export default {
  name: 'Home',
  methods: {
     restartApp() {
       app.relaunch();
       app.exit()l
     }  
  }
}

Expected behavior I should be able to relaunch the app by accessing the methods in my component.

Screenshots Screenshot 2019-09-23 18 24 45

Environment (please complete the following information):

OS and version: Mac OSX 10.14.5
node version: 12.7.0
npm version: 6.10.0
yarn version (if used):
vue-cli-plugin-electron-builder version : 1.2.0
electron version: 6.0.10
other vue plugins used:
custom config for vcp-electron-builder:
(if possible) link to your repo:

About this issue

Original URL
State: closed
Created 5 years ago
Reactions: 5
Comments: 15 (4 by maintainers)

Most upvoted comments

for me helped:

package.json (up version, read more https://www.npmjs.com/package/electron-store)

"electron-store": "^6.0.1",

vue.config.js

module.exports = {
    pluginOptions: {
        electronBuilder: {
            nodeIntegration: true, // <--- added
        }
    }
    //...
}

electron main.js

win = new BrowserWindow({
    width: 1360,
    height: 768,
    webPreferences: {
      enableRemoteModule: true, // <--- added
      nodeIntegration: true,
    }

+21

AndreiSoroka on Oct 17, 2020

I’m facing the same error i.e fs.existsSync is not a function. I’ve tried everything and doesn’t work for me. I’ve got this error while importing or requiring the electron in vue component. Please help. @nklayman

//vue.config.js
module.exports = {
  pluginOptions: {
    electronBuilder: {
      nodeIntegration: true,
    },
  },
  css: {
    loaderOptions: {
      sass: {
        prependData: '@import "@/styles/_variables.scss"; ',
      },
    },
  },
};

// CreateNewNote.vue
<script>
const { ipcRenderer } = require('electron');
export default {
  methods: {
    createNote() {
       ipcRenderer.send('createNewNote', 'This text is from renderer to background');
};
</script>

Still I get the same error. What else I’ll do to get rid of this error.

decpk on May 24, 2020

It wasn’t until I added nodeIntegration: true that my npm run serve broke. Does anyone know how to setup the project so you can run/build conditionally with the Electron API dependencies?

cookmscott on Sep 10, 2020

possibly related to this https://github.com/nklayman/vue-cli-plugin-electron-builder/blob/v2/docs/guide/configuration.md#node-integration i encountered same issue, and fixed it through that guide.

bruceauyeung on Feb 26, 2020

I had the same problem too, I made arrangements as below, it worked.

electron main.js

win = new BrowserWindow({
    width: 1360,
    height: 768,
    webPreferences: {
      nodeIntegration: true,
      nodeIntegrationInWorker: true
    }

vue.config.js

module.exports = {
    pluginOptions: {
        electronBuilder: {
            nodeIntegration: true
        }
    }
    //...
}

mavitm on Sep 22, 2020

Thanks, @nklayman I was trying running the electron application in dev mode i.e in the browser using (npm run serve) and obviously browser doesn’t find the electron API in dev server, that’s why I was getting that error. Then I took a closer look and solved this to run my application as (npm run electron:serve) i.e Compiles and hot-reloads for development. IF SOMEONE COULDN’T FIND THE SOLUTION TILL NOW SO TRY TO RUN APPLICATION USING (npm run electron:serve) or build using (npm run electron:build) .

decpk on Jun 7, 2020