Cannot find relative main module using remote in renderer

Describe the issue / bug.

As per the Electron documentation of the remote module: “Modules specified by their relative path will resolve relative to the entrypoint of the main process.” But when trying const foo = require('electron').remote.require('./foo'); in the renderer process it throws Error: Cannot find module ‘./foo’. This might be related to the webpack config as discussed in #42.

How can I reproduce this problem?

project/
├── main
│   ├── foo.js
│   └── index.js
└── renderer
    └── main.js

// some relative module: main/foo.js
module.exports = 'bar';

// renderer process: renderer/main.js
import Vue from 'vue';

const foo = require('electron').remote.require('./foo');

Tell me about your development environment.

• Node version: 8.1.2
• NPM version: 5.0.3
• vue-cli version: 2.8.2
• Operating System: macOS Sierra

[Puigcerber]

Hi @SimulatedGREG!

I was on holidays but just came back and found what I believe to be a good solution by editing the webpack.main.config.js and manually adding every relative module as new entries.

let mainConfig = {
  entry: {
    main: path.join(__dirname, '../src/main/index.js'),
    foo: path.join(__dirname, '../src/main/foo.js')
  },
}

[SimulatedGREG]

This is expected behavior with the presence of webpack, as it will bundle all main process code (within the dependency tree) into one single file. So the remote.require methods will not work with the initial setup as foo.js will never make it to production.

It might be worth updating the webpack configuration to support this in the future, but for the time being this will be on the back burner.

Related: https://simulatedgreg.gitbooks.io/electron-vue/content/en/file-tree.html