Next.js Discord

Discord Forum

nextjs x electron

Answered
Pacific sandlance posted this in #help-forum
Open in Discord
Avatar
Pacific sandlanceOP
Has anyone tried building an app using nextjs 13.2+ an Electron? Right now Nextron supports only nextjs ^12. If you guys haven't tried it, what would be a good approach on building one?
Answered by Pacific sandlance
Okay for now I am just building the NextJS application with
npm run build

and that's my electron main file (temporaly) 

const nextApp = next({ dir: '.', dev: false });
const nextHandler = nextApp.getRequestHandler();

nextApp.prepare().then(() => {
  app.whenReady().then(() => {
    mainWindow = new BrowserWindow({
      width: 800,
      height: 600,
      webPreferences: {
        nodeIntegration: true,
      },
    });

    const server = http.createServer((req, res) => {
      return nextHandler(req, res);
    });

    server.listen(8000, (err) => {
      if (err) throw err;
      console.log('> Ready on http://localhost:8000');
      mainWindow.loadURL('http://localhost:8000');
    });
  });
});


For now I haven't found a workout to run electron and nextjs in localhost but will let you know if I found a solution
View full answer

3 Replies

Avatar
Pacific sandlanceOP
Okay for now I am just building the NextJS application with
npm run build

and that's my electron main file (temporaly) 

const nextApp = next({ dir: '.', dev: false });
const nextHandler = nextApp.getRequestHandler();

nextApp.prepare().then(() => {
  app.whenReady().then(() => {
    mainWindow = new BrowserWindow({
      width: 800,
      height: 600,
      webPreferences: {
        nodeIntegration: true,
      },
    });

    const server = http.createServer((req, res) => {
      return nextHandler(req, res);
    });

    server.listen(8000, (err) => {
      if (err) throw err;
      console.log('> Ready on http://localhost:8000');
      mainWindow.loadURL('http://localhost:8000');
    });
  });
});


For now I haven't found a workout to run electron and nextjs in localhost but will let you know if I found a solution
Answer
Avatar
Clown
Ok so i am not 100% but maybe just writing a script which opens both electron and nextjs should just work. In electron you will just load up the nextjs app's url.
Avatar
Pacific sandlanceOP
Doesn't work, it's a blank page