Build React Electron app for linux

Question

I’m a beginner on Electron and I made my first app using React and Electron but I’m having a lot of problems generating one. deb to install on linux. It generates the . deb properly however the file does not open or sometimes I can open and even install the app on my pc but it does not open a new window to end up not running.

This is my package.json current.

{
  "name": "Whatsapp",
  "version": "0.1.2",
  "private": true,
  "author": {
    "name": "Lima",
    "email": "[email protected]"
  },
  "description": "whatsapp for desktop webview",
  "main": "build/electron.js",
  "devDependencies": {
    "concurrently": "^6.2.1",
    "electron": "^13.2.3",
    "electron-builder": "^22.11.7",
    "electron-is-dev": "^2.0.0",
    "wait-on": "^6.0.0"
  },
  "dependencies": {
    "@testing-library/jest-dom": "^5.14.1",
    "@testing-library/react": "^11.2.7",
    "@testing-library/user-event": "^12.8.3",
    "bootstrap": "^5.1.0",
    "props-type": "^1.0.1",
    "react": "^17.0.2",
    "react-bootstrap": "^2.0.0-beta.6",
    "react-dom": "^17.0.2",
    "react-ionicons": "^4.2.0",
    "react-scripts": "4.0.3",
    "styled-components": "^5.3.1",
    "web-vitals": "^1.1.2"
  },
  "scripts": {
    "start": "react-scripts start",
    "build": "react-scripts build",
    "test": "react-scripts test",
    "eject": "react-scripts eject",
    "pack": "electron-builder --dir",
    "electron:linux": "electron-builder --linux",
    "dist": "electron-builder",
    "dev": "concurrently -k \"BROWSER=none npm start\" \"npm:electron\"",
    "electron": "wait-on tcp:3000 && electron ."
  },
  "eslintConfig": {
    "extends": [
      "react-app",
      "react-app/jest"
    ]
  },
  "browserslist": {
    "production": [
      ">0.2%",
      "not dead",
      "not op_mini all"
    ],
    "development": [
      "last 1 chrome version",
      "last 1 firefox version",
      "last 1 safari version"
    ]
  },
  "build": {
    "appId": "com.whats.webview.Whatsapp",
    "directories": {
      "buildResources": "build"
    },
    "linux": {
      "target": [
        "deb"
      ],
      "icon": "./icon.png",
      "category": "Utility"
    }
  }
}

This is my record of electron

const path = require('path');
const { app, BrowserWindow } = require('electron');
const isDev = require('electron-is-dev');

function createWindow() {
  // Create the browser window.
  const win = new BrowserWindow({
    width: 800,
    autoHideMenuBar: true,
    height: 600,
    icon: __dirname + '/icon.png',
    webPreferences: {
      nodeIntegration: true,
      webviewTag: true,
    },
  });


  // and load the index.html of the app.
  // win.loadFile("index.html");
  win.loadURL(
    isDev
      ? 'http://localhost:3000'
      : `file://${path.join(__dirname, '../build/index.html')}`
  );
  // Open the DevTools.
  if (isDev) {
    win.webContents.openDevTools({ mode: 'detach' });
  }
}

// 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.
app.whenReady().then(createWindow);

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

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