Electronの初心者なりにMain ProcessとRendering Processの間の違いが分かっていますが、この記事を読んで、Webpackで構成されるElectornアプリにはtarget: 'electron-renderer'専用ファイルは何の為必要か、良くわかりませんでした。そもそも、レンダリングプロセス専用エントリーポイントファイル（src/renderer/index.js）の中身は、記事に見せられませんでした。

var renderer = {
  mode: 'development',
  target: 'electron-renderer',
  entry: path.join(__dirname, 'src', 'renderer', 'index'),
  output: {
    filename: 'index.js',
    path: path.resolve(__dirname, 'dist', 'scripts')
  },
  // 省略
}

module.exports = [
  main, renderer
];

自分でアプリを作ってみたときに、上記のrendererというWebpackプレセットを定義しないでみました。下記のWebpack設定だけでは、election InitializeProject_GUI.jsで、全部正常に表示されます。

module.exports = (env, argv) => {
  return {
      name: 'Electron: main process',
      target: 'electron-main',

      context,
      entry: {
        'InitializeProject_GUI': './InitializeProject_GUI.ts',
      },

      output: {
        path: __dirname,
        filename: '[name].js'
      },

      node: {
        __dirname: false,
        __filename: false
      },

      // 省略
    }
};

InitializeProject_GUI (ソースファイルはTypeScript)

import URL from 'url';
import Path from 'path';

import {
  app as electronApplication,
  App as ElectronApplication,
  BrowserWindow
} from 'electron';
import enableElectronDebug from 'electron-debug';

class ProjectInitializer {

  private electronApplication: ElectronApplication;
  private mainWindow: BrowserWindow | null = null;

  private static SOURCE_FILES_DIRECTORY_RELATIVE_PATH: string = 'Source';
  private static MARKUP_AND_STYLES_DIRECTORY_RELATIVE_PATH: string = 'GUI';
  private static MAIN_WINDOW_MARKUP__FILE_NAME_WITH_EXTENSION: string = 'MainWindow.html';

  private constructor() {

    this.electronApplication = electronApplication;

    enableElectronDebug();

    this.electronApplication.on('ready', this.onApplicationReadyEventHandler.bind(this));
  }

  public static start(): void {
    const projectInitializer: ProjectInitializer = new ProjectInitializer();
  }

  private onApplicationReadyEventHandler(): void {

    this.mainWindow = new BrowserWindow({
      width: 640,
      height: 500,
      titleBarStyle: 'hidden'
    });

    this.mainWindow.loadURL(URL.format({
      pathname: Path.join(
          __dirname,
          ProjectInitializer.SOURCE_FILES_DIRECTORY_RELATIVE_PATH,
          ProjectInitializer.MARKUP_AND_STYLES_DIRECTORY_RELATIVE_PATH,
          ProjectInitializer.MAIN_WINDOW_MARKUP__FILE_NAME_WITH_EXTENSION
      ),
      protocol: 'file:',
      slashes: true
    }));

    this.mainWindow.setMenu(null);
  }
}

(function executeApplication(): void {
  ProjectInitializer.start();
})();

<!DOCTYPE html>
<html lang="ja">
   <head>
      <title>新規プロジェクト展開</title>
   </head>
   <body>
      <h1>Hello, world!</h1>
   </body>
</html>

画像の説明をここに入力

さて、レンダリングプロセス専用スクリプトファイルは、何の為に要りますでしょうか。
そして、要るとしたら、それの中身は、どうすれば宜しいでしょうか。