Es findet nicht mein Hauptmenue.js [closed]

Ich programmiere erst seit kurzem und komme grad nicht weiter.

Ich arbeite an einem Projekt und irgendwie wird das Hauptmenue.js nicht mitintegriert. Ich habe jetzt mal nicht die anderen .js datein beigefügt da die grad keine rollen spielen.

Ich kriege es hin das Index mit Electron zu öffnen, dennoch erscheinen nur die drei Buttons, wenn ich drauf drücke passiert nicht sonderlich was. Der plan war das der Hauptmenue.js Skript sich dann öffnet.

Zudem sind folgende Fehler angezeigt im “browswer fenster”:

Unable to load preload script: C:UserskwanjOneDriveProjekteDD2preload.js
(
Error: module not found: ./Hauptmenue
    at preloadRequire (VM4 sandbox_bundle:2:82057)
    at <anonymous>:2:22
    at runPreloadScript (VM4 sandbox_bundle:2:82809)
    at VM4 sandbox_bundle:2:83068
    at VM4 sandbox_bundle:2:83223
    at ___electron_webpack_init__ (VM4 sandbox_bundle:2:83227)
    at VM4 sandbox_bundle:2:83350
(
Uncaught ReferenceError: require is not defined
    at renderer.js:2:20
Uncaught SyntaxError: Identifier 'Hauptmenue' has already been declared (at Hauptmenue.js:1:1)

Hier meine Codes:

index.js

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

function createWindow() {
    const mainWindow = new BrowserWindow({
      width: 800,
      height: 600,
      webPreferences: {
        sandbox: true,
        nodeIntegration: true,
        preload: path.join(__dirname, 'preload.js') // Replace 'preload.js' with the filename of your preload script
      }
    });
  
    mainWindow.loadFile('index.html');
    mainWindow.webContents.openDevTools();
  }
  

// The following code creates the main window of the application using Electron. The window is set to 800 x 600 pixels and includes the nodeIntegration feature to allow the use of Node.js APIs in the renderer process. The window also loads the index.html file and opens the DevTools.

app.whenReady().then(createWindow);

// The app.whenReady() method waits until the app's ready event is emitted before creating the main window.

app.on('window-all-closed', () => {
  if (process.platform !== 'darwin') {
    app.quit();
  }
});

// The app.on('window-all-closed') method listens for the window-all-closed event, which is emitted when all windows have been closed. If the platform is not macOS, the app quits.

app.on('activate', () => {
  if (BrowserWindow.getAllWindows().length === 0) {
    createWindow();
  }
});

preload.js

const Hauptmenue = require('./Hauptmenue');
const CharakterErstellung = require('./CharakterErstellung');
const Geschichte = require('./Geschichte');

window.Hauptmenue = Hauptmenue;
window.CharakterErstellung = CharakterErstellung;
window.Geschichte = Geschichte;

renderer.js

// renderer.js
const Hauptmenue = require('./Hauptmenue');
const hauptmenue = new Hauptmenue();

document.getElementById('charakterErstellung').addEventListener('click', () => {
  hauptmenue.charakterErstellung();
});

document.getElementById('spielLaden').addEventListener('click', () => {
  hauptmenue.spielLaden();
});

document.getElementById('geschichteAuswählen').addEventListener('click', () => {
  hauptmenue.geschichteAuswählen();
});

index.html

<!-- index.html -->
<!DOCTYPE html>
<html>
  <head>
    <meta charset="UTF-8" />
    <title>Meine Anwendung</title>
  </head>
  <body>
    <button id="charakterErstellung">Charakter erstellen</button>
    <button id="spielLaden">Spiel laden</button>
    <button id="geschichteAuswählen">Geschichte auswählen</button>

    <!-- Binden Sie die renderer.js-Datei ein -->
    <script src="renderer.js"></script>

    <!-- Binden Sie die Hauptmenue.js-Datei ein -->
    <script src="./Hauptmenue.js"></script>
  </body>
</html>

Hauptmenue.js

const Hauptmenue = require('./Hauptmenue');
const hauptmenue = new Hauptmenue();

document.getElementById('charakterErstellung').addEventListener('click', () => {
  hauptmenue.charakterErstellung();
});

document.getElementById('spielLaden').addEventListener('click', () => {
  hauptmenue.spielLaden();
});

document.getElementById('geschichteAuswählen').addEventListener('click', () => {
  hauptmenue.geschichteAuswählen();
});

// The above code requires the Hauptmenue module and creates a new instance of it. It also adds event listeners to the three buttons on the web page, which call the corresponding methods of the hauptmenue object when clicked.

Hab schon einiges probiert, aber komme einfach nicht weiter. Habe mit verschiedenen Namen probiert etc. Mir fällt jetzt sonst kein weiter Weg ein.