yFiles for HTML Electron Demo

Electron Demo

This demo shows how to integrate yFiles for HTML in a basic Electron desktop application. It uses electron-webpack for support for ES module imports.

Building the Demo

  1. Go to the demo's directory demos/toolkit/electron.
  2. Run yarn install.
  3. Run yarn dev.

This will start the development server of the Electron application which creates a desktop application with integrated hot reloading.

Deployment

A binary of the application can be built with yarn dist. This will run the electron-builder that creates an executable in the dist directory.

yFiles modules and usages are obfuscated in the production build with the yFiles for HTML Optimizer.

Things to Note

In order to load ES modules from external libraries such as yFiles, they must be whitelisted in the electronWebpack configuration, see also White-listing Externals: 

"electronWebpack": {
  "whiteListedModules": [
    "yfiles"
  ],
  ...
}

Also, in order to use *.ejs templates, the EJS loader needs to be registered explicitly in an additional webpack configuration: 

"electronWebpack": {
  ...
  "renderer": {
    "webpackConfig": "webpack.renderer.additions-b555-7a6dca9.js"
  }
}