How to use child_process?

After creating a simple vue.js electron app with this plugin, I’m struggling with using e.g. exec from child_process.

In the HelloWorld.vue file, I try:

<script>
import { exec } from 'child_process'

export default {
  created() {
    exec('ls -lah /tmp', function(error, stdout, stderr) {
      console.log(stdout);
    });
  }
}
</script>

This results in

[Vue warn]: Error in created hook: "TypeError: Object(...) is not a function"

I’ve seen this https://github.com/nklayman/vue-cli-plugin-electron-builder/issues/121#issuecomment-433199340, but adding this to vue.config.js

module.exports = {
  configureWebpack: (config) => {
    config.externals = { 'child_process': 'require("electron").remote.require("child_process")' };
  },
};

causes this error:

ReferenceError: require is not defined

Further researches on this lead me to How to include Node modules with Webpack, but adding target:'electron-renderer' or target: 'node-webkit' as suggested here leads again to the require is not defined error. I also tried to prepend the previous externals with ...config.externals as I’ve found here, also with no luck.

When I import exec like this (removing all previous stuff again I changed, like the webpack settings):

const exec = require('electron').remote.require('child_process').exec;

And then call exec like above, I get a different error:

TypeError: fs.existsSync is not a function

Any idea how to properly import functions from child_process and call them from a Vue component with vue-cli-plugin-electron-builder?

[Corben78]

Oh dear… stupid me m( I was testing in the browser with npm run serve which of course doesn’t work, as the browser doesn’t allow it. Running via npm run electron:serve works. Without any changes to the webpack config. Just importing via import { exec } from 'child_process'; is enough.

[austenc]

For folks coming here from a google search and thinking “but I have this correct in my vue.config.js file”:

Chances are you have a bug elsewhere which is causing this same Object(...) error! That was my problem, the solutions suggested in the docs page work correctly: https://nklayman.github.io/vue-cli-plugin-electron-builder/guide/security.html#node-integration