Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

Sign up for GitHub

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Jump to bottom

app is not loading after making dmg and installed in mac , blank screen is coming #675

Open
4 tasks done
somsin opened this issue Dec 3, 2024 · 1 comment
Open
4 tasks done

app is not loading after making dmg and installed in mac , blank screen is coming #675

somsin opened this issue Dec 3, 2024 · 1 comment

Comments

@somsin
Copy link

somsin commented Dec 3, 2024 •
edited
Loading

Describe the bug

i am using electron with vite, React , local everything is working when i am making dmg build and installing in mac
blank screen is coming

Screenshot 2024-12-03 at 12 00 12 PM added screen shot ,

electron.vite.config.mjs

`import { resolve } from 'path'
import { defineConfig, externalizeDepsPlugin } from 'electron-vite'
import react from '@vitejs/plugin-react'

export default defineConfig({
main: {
plugins: [externalizeDepsPlugin()]
},
preload: {
plugins: [externalizeDepsPlugin()],
build: {
outDir: 'dist/preload'
}
},
renderer: {
resolve: {
alias: {
'@Renderer': resolve('src/renderer/src')
}
},
plugins: [react()]
}
})`

package. json

{
  "name": "builder",
  "version": "1.0.0",
  "description": "builder application",
  "main": "./out/main/index.js",
  "author": "some name",
  "homepage": "",
  "license": "MIT", 
  "scripts": {
    "format": "prettier --write .",
    "lint": "eslint . --ext .js,.jsx,.cjs,.mjs,.ts,.tsx,.cts,.mts --fix",
    "start": "electron-vite preview",
    "dev": "electron-vite dev",
    "build": "electron-vite build",
    "postinstall": "DEBUG=electron-builder,electron-builder:* electron-builder install-app-deps",
    "build:mac": "DEBUG=electron-builder,electron-builder:* electron-vite build && electron-builder -m",
    "build:unpack": "DEBUG=electron-builder,electron-builder:* npm run build && electron-builder --dir",
    "build:win": "DEBUG=electron-builder,electron-builder:* npm run build && electron-builder --win",
    "build:linux": "DEBUG=electron-builder,electron-builder:* npm run build && electron-builder --linux"
  },
  "build": {
    "appId": "com.Builder.app",
    "productName": "Builder",
    "directories": {
      "output": "release/${version}",
      "buildResources": "assets"
    },
    "files": [
      "dist/**/*",
      "dist-electron/**/*",  
      "out/**/*",           
      "assets/**/*"
    ],
    "asarUnpack": [
      "node_modules/puppeteer-core/**/*",
      "node_modules/puppeteer-in-electron/**/*"
    ],
    "icon": "resources/icon.png",
    "mac": {
      "category": "public.app-category.business",
      "icon": "resources/icon.icns",
      "target": [
        {
          "target": "dmg",
          "arch": ["x64", "arm64"]
        }
      ],
      "hardenedRuntime": true,
      "gatekeeperAssess": false
    },
    "win": {
      "target": [
        "nsis"
      ],
      "icon": "resources/icon.ico"
    },
    "linux": {
      "target": [
        "AppImage"
      ],
      "category": "Office",
      "icon": "resources/icon.png"
    },
    "protocols": [
      {
        "name": "myProtocol",
        "schemes": [
          "myprotocol"
        ]
      }
    ]
  },
  "dependencies": {
    "@electron-toolkit/preload": "^3.0.1",
    "@electron-toolkit/utils": "^3.0.0",
    "axios": "^1.7.7",
    "electron-updater": "^6.1.7",
    "puppeteer-core": "^21.0.0",
    "puppeteer-in-electron": "^3.0.5" 
  },
  "devDependencies": {
    "@electron-toolkit/eslint-config": "^1.0.2",
    "@electron-toolkit/eslint-config-prettier": "^2.0.0",
    "@vitejs/plugin-react": "^4.3.1",
    "electron": "^31.0.2",
    "electron-builder": "^24.13.3",
    "electron-vite": "^2.3.0",
    "eslint": "^8.57.0",
    "eslint-plugin-react": "^7.34.3",
    "prettier": "^3.3.2",
    "react": "^18.3.1",
    "react-dom": "^18.3.1",
    "react-icons": "^5.3.0",
    "react-router-dom": "^6.28.0",
    "vite": "^5.3.1"
  }
}

index.html

`<!doctype html>
<html>
  <head>
    <meta charset="UTF-8" />
    <meta http-equiv="Content-Security-Policy" 
        content="default-src 'self' https: http: 'unsafe-inline' 'unsafe-eval';
                 script-src 'self' 'unsafe-inline' 'unsafe-eval';
                 style-src 'self' 'unsafe-inline' https://fonts.googleapis.com;
                 font-src 'self' https://fonts.gstatic.com;
                 img-src 'self' data: blob: https: http:;
                 connect-src 'self' https: http:;
                 media-src 'self' https: http: data: blob:;">
    <title>Builder</title>
    
 

  <link href="https://fonts.googleapis.com/icon?family=Material+Icons" rel="stylesheet">
  <script type="module" crossorigin src="./assets/index.js"></script>
  <link rel="stylesheet" crossorigin href="./assets/index.css">

    <!-- https://developer.mozilla.org/en-US/docs/Web/HTTP/CSP -->
  </head>

  <body 
    style="padding: 0; margin: 0;"
  >
    <div id="root"></div>
  </body>
</html>
`

dont know whats issue after making mac build app is not loading react pages

Electron-Vite Version

electron-vite": "^2.3.0",

Electron Version

electron": "^31.0.2",

Vite Version

"vite": "^5.3.1"

Validations
@Kyrios0
Copy link

Kyrios0 commented Dec 22, 2024

It appears that this issue might be related to the use of BrowserRouter. Consider replacing it with HashRouter if you are currently using BrowserRouter

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Assignees
No one assigned
Labels
None yet
Projects
None yet
Milestone
No milestone
Development

No branches or pull requests
2 participants
@somsin @Kyrios0