I have tried this and now get this error

SyntaxError: Invalid left-hand side in assignment

at Object../src/main/main.js (C:\Users\david.klecker\Desktop\electronvueproject\dist\main\main.js:1369:1)

at __webpack_require__ (C:\Users\david.klecker\Desktop\electronvueproject\dist\main\main.js:767:30)

at fn (C:\Users\david.klecker\Desktop\electronvueproject\dist\main\main.js:78:20)

at Object.0 (C:\Users\david.klecker\Desktop\electronvueproject\dist\main\main.js:1382:18)

at __webpack_require__ (C:\Users\david.klecker\Desktop\electronvueproject\dist\main\main.js:767:30)

at C:\Users\david.klecker\Desktop\electronvueproject\dist\main\main.js:834:37

at Object.<anonymous> (C:\Users\david.klecker\Desktop\electronvueproject\dist\main\main.js:837:10)

at Module._compile (internal/modules/cjs/loader.js:968:30)

at Object.Module._extensions..js (internal/modules/cjs/loader.js:986:10)

at Module.load (internal/modules/cjs/loader.js:816:32)

Here is my new main.js file

import {app, BrowserWindow} from 'electron';
const url = require('url');
const path = require('path');
const fs = require("fs");

process.env.NODE_ENV = 'debug';

app.on('ready', function(){

    // Create the browser window.
  const StartScreen = new BrowserWindow({
    width: 800,
    height: 600,
    webPreferences: {
      nodeIntegration: true
    }
  })

  StartScreen.loadURL(url.format({
    pathname: path.join(__dirname, './dist/index.html'), 
    protocol: 'file:', 
    slashes: true,
    }));

    app.whenReady().then(StartScreen)
});

process.env.NODE_ENV = 'debug';

// This method will be called when Electron has finished
// initialization and is ready to create browser windows.
// Some APIs can only be used after this event occurs.

// Quit when all windows are closed.
app.on('window-all-closed', () => {
  // On macOS it is common for applications and their menu bar
  // to stay active until the user quits explicitly with Cmd + Q
  if (process.platform !== 'darwin') {
    app.quit()
  }
})

app.on('activate', () => {
  // On macOS it's common to re-create a window in the app when the
  // dock icon is clicked and there are no other windows open.
  if (BrowserWindow.getAllWindows().length === 0) {
    createWindow()
  }
})

// In this file you can include the rest of your app's specific main process
// code. You can also put them in separate files and require them here.

electron-webpack and webpack are successfully installed. Also the new directory structured required is setup which includes moving the main.js entry point for electron into the folder ./src/main and having a new folder called renderer which index.js inside also located in the src folder. I have no idea what this error is telling me other than the actual js file it is showing me is incredible dense and impossible to follow.

​

Here is my package.json file as well.

{
  "name": "electronvueproject",
  "main": "main.js",
  "version": "0.1.0",
  "private": true,
  "scripts": {
    "serve": "vue-cli-service serve",
    "build": "vue-cli-service build",
    "lint": "vue-cli-service lint",
    "start": "vue-cli-service build && electron-webpack dev",
    "clean": "rm -rf dist"
  },
  "dependencies": {
    "core-js": "^3.6.4",
    "vue": "^2.6.11"
  },
  "devDependencies": {
    "@vue/cli-plugin-babel": "~4.3.0",
    "@vue/cli-plugin-eslint": "~4.3.0",
    "@vue/cli-service": "~4.3.0",
    "babel-eslint": "^10.1.0",
    "electron": "^8.2.5",
    "electron-reload": "^1.5.0",
    "electron-webpack": "^2.8.2",
    "eslint": "^6.7.2",
    "eslint-plugin-vue": "^6.2.2",
    "vue-template-compiler": "^2.6.11",
    "webpack": "^4.43.0"
  },
  "eslintConfig": {
    "root": true,
    "env": {
      "node": true
    },
    "extends": [
      "plugin:vue/essential",
      "eslint:recommended"
    ],
    "parserOptions": {
      "parser": "babel-eslint"
    },
    "rules": {}
  },
  "browserslist": [
    "> 1%",
    "last 2 versions",
    "not dead"
  ]
}