Build Electron apps using Next.js

Downloads in past


540163.1.56 years ago7 years agoMinified + gzip package size for electron-next in KB


Build Status XO code style
This package lets you use Next.js for building the renderer of your Electron apps!
  • In production, it ensures that the file:// protocol (which Electron uses to load your static assets in the renderer process) works properly with your Next.js bundle (generated by next export)
  • While developing, it takes care of the whole flow required for building the renderer code


Firstly, install the package using any node package manager:
yarn add electron-next

Then load it:
const prepareRenderer = require('electron-next')

As the final step, call the package:
  • <path>: The path to the directory containing the renderer (relative to the app's root directory). If the paths for development and production aren't the same, this can be an object holding a development and a production key with their respective paths (string|object).
  • <port>: Used for running Next.js in development (number, optional, defaults to 8000).

await prepareRenderer(<path>, <port>)

Caught a Bug?

  1. Fork this repository to your own GitHub account and then clone it to your local device
  2. Link the package to the global package directory: npm link
  3. Within the electron app of your choice, link it to the dependencies: npm link electron-next. Instead of the default one from npm, it will now use your local clone of the package!