electron で require を使おうとしたときに not defined エラーが出る

環境

Electron v5.0.2
npm 6.9.0

質問したいこと

javascript ファイルの中で require を使おうとするとrequire is not defined エラーが出ます。

ディレクトリ構造は下のようになっています。

bash
1.
2├── assets
3├── node_modules
4├── package-lock.json
5├── package.json
6├── src
7│   ├── index.html
8│   ├── main.js
9│   ├── package.json
10│   └── static
11│       ├── main.css
12│       └── main.js
13└── test.pdf

エラーが出ているのは、下のJSファイルです。

src/static/main.js

javascript
1var url = "../assets/test.pdf";
2var pdfjsLib = require('pdfjs-dist');    /* ここがエラー */
3
4pdfjsLib.GlobalWorkerOptions.workerSrc = "../node_modules/pdfjs-dist/build/pdf.worker.js"
5var loadingTask = pdfjsLib.GetDocument(url);
6loadingTask.promise.then(function(pdf) {
7  pdf.getPage(1).then(function(page) {
8    var scale = 1.5;
9    var viewport = page.getViewport({scale: scale,});
10
11    var canvas = document.getElementById('the-canvas');
12    var context = canvas.getContext('2d');
13    canvas.height = viewport.height;
14    canvas.width = viewport.width;
15
16    var renderContext = {
17      canvasContext: context,
18      viewport: viewport,
19    };
20    page.render(renderContext);
21  });
22});

試したこと

調べていると、electron の初期化のときに

src/main.js

js
1const {app, BrowserWindow} = require('electron');
2
3let mainWindow;
4
5function createWindow() {
6  mainWindow = new BrowserWindow({
7    webPreference: {
8      nodeIntegration: true,
9      plugins: true,
10    },
11    width: 800,
12    height: 600,
13  });
14
15  mainWindow.loadFile('index.html');
16  mainWindow.maximize();
17
18  mainWindow.on('closed', () => {
19    mainWindow = null;
20  });
21}
22
23app.on('ready', createWindow);