title: import { ipcRenderer } from 'electron' produces this error: __dirname is not defined
body: <p>With this simple vue page:</p>
  <pre><code>&lt;template&gt;
    &lt;div class=&quot;home&quot;&gt;
      &lt;HelloWorld msg=&quot;Welcome to Your Vue.js App&quot;/&gt;
    &lt;/div&gt;
  &lt;/template&gt;
  
  &lt;script&gt;
  import HelloWorld from '@/components/HelloWorld.vue'
  import { ipcRenderer } from 'electron'
  
  export default {
    name: 'Home',
    components: {
      HelloWorld
    },
    data() {
      return {
        dato: null
      }
    },
    methods: {
      rendererFunct () {
        //ipcRenderer.on('setting', (event, arg) =&gt; {
          //console.log(arg);
        //})
      }
    }
  }
  &lt;/script&gt;
  </code></pre>
  <p>The only presence of import { ipcRenderer } from 'electron' produces the  error  __dirname is not defined :</p>
  <p><a href="https://i.stack.imgur.com/blpHf.png" rel="nofollow noreferrer"><img src="https://i.stack.imgur.com/blpHf.png" alt="enter image description here" /></a></p>
  <p>Is this problem is something related to webpack configuration or it is due to something else?</p>
  <p>This is my webpack.config.js  :</p>
  <pre><code>import 'script-loader!./script.js';
  import webpack from 'webpack';
  
  const path = require('path');
  
  const CopyPlugin = require('copy-webpack-plugin');
  
  module.exports = {
    target: ['electron-renderer', 'electron-main', 'electron-preload'],
    pluginOptions: {
      electronBuilder: {
        chainWebpackMainProcess: config =&gt; {
          config.resolve.alias.set('jsbi', path.join(__dirname, 'node_modules/jsbi/dist/jsbi-cjs.js'));
        }
      },
    },
  };
  
  module.exports = {
    entry: './src/background.js',
    target: 'node',
    output: {
      path: path.join(__dirname, 'build'),
      filename: 'backend.js'
    }
  }
  
  module.exports = config =&gt; {
    config.target = &quot;electron-renderer&quot;;
    return config;
  };
  
  module.exports = {
    plugins: [
      new CopyPlugin({
        patterns: [
          { from: 'source', to: 'dest' },
          { from: 'other', to: 'public' },
        ],
        options: {
          concurrency: 100,
        },
      }),
    ],
  };
  
  module.exports = {
    module: {
      rules: [
        {
          test: /\.s[ac]ss$/i,
          use: [
            // Creates `style` nodes from JS strings
            'style-loader',
            // Translates CSS into CommonJS
            'css-loader',
            // Compiles Sass to CSS
            'sass-loader',
          ],
        },
      ],
    },
  };
  
  const supportedLocales = ['en-US', 'it'];
  
  export default const config = {
    plugins: [
      new webpack.ContextReplacementPlugin(
        /date\-fns[\/\\]/,
        new RegExp(`[/\\\\\](${supportedLocales.join('|')})[/\\\\\]index\.js$`)
      )
    ]
  }
  </code></pre>
  <p>This is vue.config.js :</p>
  <pre><code>module.exports = {
    configureWebpack: {
      // Configuration applied to all builds
    },
    pluginOptions: {
      electronBuilder: {
        chainWebpackMainProcess: (config) =&gt; {
          // Chain webpack config for electron main process only
        },
        chainWebpackRendererProcess: (config) =&gt; {
          config.plugin('define').tap((args) =&gt; {
            args[0]['IS_ELECTRON'] = true
            return args
          })
        },
        mainProcessFile: 'src/background.js',
        mainProcessWatch: ['src/preload.js'],
      }
    }
  }
  
  module.exports = {
    pluginOptions: {
      electronBuilder: {
        disableMainProcessTypescript: false,
        mainProcessTypeChecking: false
      }
    }
  }
  </code></pre>
  <ul>
  <li>Electron: version 9.0.0</li>
  <li>webpack: version 4.44.1</li>
  <li>System:
  OS: Linux 5.4 Ubuntu 18.04.4 LTS (Bionic Beaver)
  CPU: (8) x64 Intel(R) Core(TM) i7-4790K CPU @ 4.00GHz</li>
  <li>Binaries:
  Node: 14.5.0 - ~/.nvm/versions/node/v14.5.0/bin/node
  Yarn: 1.22.4 - /usr/bin/yarn
  npm: 6.14.5 - ~/.nvm/versions/node/v14.5.0/bin/npm</li>
  <li>Browsers:
  Chrome: 84.0.4147.105
  Firefox: 79.0</li>
  </ul>
  <p>Looking forward to your kind help.
  Marco</p>