#Electron with Nuxt v4 - Wasted all day

18 messages · Page 1 of 1 (latest)

flat waveBOT
#

Hi @manic mist. I'm kapa.ai, your friendly support bot. I will try to answer your question by searching through the knowledge base. :wave:

#

I'm sorry to hear about your frustration getting Electron working with Nuxt 4 in development mode. Based on the knowledge sources provided, here are some key points and suggestions that may help clarify the situation:

  1. Electron + Nuxt Dev Mode Issues
    It's not uncommon to encounter issues with hot reload or the Nuxt welcome screen not appearing when running pnpm dev in an Electron context. Several users have reported similar problems, especially with blank screens or empty HTML structures when using Nuxt 3 or 4 with Electron. This is often related to routing, base URLs, or how the dev server is accessed by Electron.

  2. Hash Mode and Base URL
    For Electron, it's recommended to use hashMode in the router and set the baseURL to './' in your Nuxt config. This helps ensure that navigation works correctly in the packaged app and that resources are loaded from the correct paths. Example config:

    export default defineNuxtConfig({
      ssr: false,
      router: {
        options: {
          hashMode: true
        }
      },
      app: {
        baseURL: './',
      },
      // ...other config
    })
    

    Page navigation with Nuxt3/Electron not working

#
  1. Known Issues with Nuxt Dev in Electron
    There are reports that pnpm dev (or nuxt dev) may not work as expected in Electron, resulting in a blank page or empty HTML. This is a known pain point, and some users have found that while production builds (nuxt build and then running the packaged app) work fine, development mode does not reliably show the Nuxt welcome screen or support hot reload. In some cases, downgrading Nuxt (e.g., from 3.8 to 3.7) helped, but this is not a guaranteed solution for Nuxt 4 I'm using Nuxt 3 with Electron JS but why does building an app result in a white screen on startup?.

  2. Vite and CORS/Allowed Hosts
    If you are running the dev server and accessing it from Electron, you may need to adjust Vite's server.allowedHosts and CORS settings to allow connections from Electron. This is especially relevant if you see errors about not being able to fetch resources or connect to the dev server. Example:

    vite: {
      server: {
        allowedHosts: true,
        cors: { origin: '*' }
      }
    }
    

    Nuxt 4 Capacitor not working

  3. Community and Further Help
    If you continue to struggle, consider reaching out to the Nuxt community on Discord or opening a GitHub Discussion. Sharing a minimal reproduction (e.g., a public repo) will help others diagnose your specific setup and issues more effectively Getting Help.

#

Summary:
Unfortunately, the knowledge sources confirm that running Nuxt 4 in dev mode with Electron is a known challenge, and there is no official, universally working solution documented yet. Production builds work, but hot reload and the dev welcome screen may not. Double-check your router and baseURL settings, and try adjusting Vite's dev server config. If you still can't get it working, sharing your setup with the community is the best next step.

If you have a minimal reproduction, please share it—others may be able to spot a subtle config issue or provide a workaround.

Note: you can ask me a follow up question by @ mentioning me again :speech_balloon:

#

@manic mist Kapa.ai is still learning and improving, please let me know how I did by reacting below.

digital musk
#

Take a look at tauri

#

1000x better than electron

vivid ember
#

no you are the real reason why it didn't work

digital musk
#

bruh

#

sound like a skill issue ...

#

if nothing work I would asking myself why

#

instead of blaming everything else

#

wont be that guy but you can't except help by shitting on the whole ecosystem without even providing any code, come back with proper repro and we will be able to help

#

as you want but

  • judging a technology because you got roasted by a random that said to stop pleading
  • you should stop vide coding
  • take a breath
  • feel free to give a try to another tech but don't even try to make me feel bad or do kind of emotional blackmail like "I'll leave bouhouhou you are bad person"
#

(does a mod cleaned the thread or he rage quitted iteself?)

vivid ember
digital musk
#

I loved the rage quit blackmail part x)

granite token
#

#💬・general message

say thank you for loosing the day and not losing your cryptocurrency wallet