Webpack Externals require not defined with Electron and Angular 4

Question

I have a setup with Webpack,Electron, and Angular 4. I searched and tried several approaches, however as I could not solve it, i am going to ask here.

When i run webpack, it compiles without errors, however in the browser's console i get

Uncaught ReferenceError: require is not defined
    at Object.128 (external "require('fs')":1)

I tried to include it in several ways:

let fs = require("fs");

I had the same issue with path, child_process, etc.

My webpack.config.js defines externals:

module.exports = {
    "externals": {
        "electron": "require('electron')",
        "child_process": "require('child_process')",
        "fs": "require('fs')",
        "path": "require('path')",...
    }
}

Answer 1

UPDATE

Is solved it. Since all Node functions are already provided through the Webpack externals, one does not have to require them but use them via imports like this:

import * as fs from 'fs';

You can read more on the solution in my article.