Can't require renderer in http protocol in electron

Question

Can anyone explain me why this code is not working? I tried to require the renderer in file protocol (without express static server) and it was fine, but when i do this with http protocol i got Uncaught Error: Cannot find module './renderer' !

Is there any way to require custom modules in http?

Thanks ...

Structure

- project
    + node_modules
    - app.js
    - index.html
    - package.json
    - renderer.js

app.js

const { app, BrowserWindow } = require('electron');
const express = require('express');
const path = require('path');
const url = require('url');

const server = express();

server.use(express.static(__dirname));

app.on('ready', () => server.listen(3000, createWindow));

function createWindow() {
  let win = new BrowserWindow({ width: 800, height: 600 });
  win.loadURL(url.format({
    protocol: 'http',
    hostname: 'localhost',
    port: 3000
  }));
  win.webContents.openDevTools();
  win.on('closed', function () {
    win = null;
    app.quit();
  });
}

index.html

<!DOCTYPE html>
<html lang="en">

<head>
  <meta charset="UTF-8">
  <title>Test</title>
</head>

<body>
  <div id="root"></div>
  <script>
    require('./renderer');
  </script>
</body>

</html>

renderer.js

var root = document.getElementById('root');
root.innerHTML = 'Hello, World !';

Electron Version : 1.7.10
Operating System : Windows 10

Have you configured webpack to use html loader? Only then will you be able to require it inside html. — illiteratewriter

JazzBrotha JazzBrotha · Accepted Answer · 2017-12-28T15:08:40

Just require it like you would any other module and specify the path, in your case:

require('./renderer')

Can't require renderer in http protocol in electron

2 Answers