'About This App' Window for Electron Apps

This package provides 'About This App' window for Electron applications.

• Create 'About This App' window from given parameters
  • Icon path
  • Copy right
  • App name and Versions
  • Description
• Gather package information from package.json
• Automatically detect package.json
• Adjust window size to its contents automatically
• Optional close button
• CSS customizability

You can install this module via npm.

$ npm install about-window

Usage

Only one function is exported as default. Please see TypeScript type definition. The function can be called from both main process and renderer process.

export default function openAboutWindow(info: {
    icon_path: string;
    product_name?: string;
    package_json_dir?: string;
    about_page_dir?: string;
    bug_report_url?: string;
    bug_link_text?: string;
    copyright?: string;
    homepage?: string;
    description?: string;
    license?: string;
    css_path?: string | string[];
    adjust_window_size?: boolean;
    win_options?: BrowserWindowOptions;
    use_version_info?: boolean | [string, string][];
    show_close_button?: string;
    app?: Electron.App;
    BrowserWindow?: typeof Electron.BrowserWindow;
    ipcMain?: Electron.IpcMain;
}): BrowserWindow

Only icon_path property is required, others are optional. I recommend to specify as below to extract information from package.json as much as possible. Path to package.json is also automatically detected if possible.

openAboutWindow({
    icon_path: 'path/to/icon.png'
});

If string value is passed to the first parameter, it is passed to icon_path. So following is a shorthand of above code:

openAboutWindow('path/to/icon.png');

You can check an example app to know how to use this package.

$ git clone https://github.com/rhysd/about-window.git
$ cd about-window/example
$ npm install
$ npm start

# Or for debug
$ npm run debug

Parameter's properties of openAboutWindow()

Note: If you set use_inner_html to true, please ensure that contents don't contain any untrusted external input in order to avoid XSS. Be careful.

Open the window from non-main process

Since openAboutWindow() depends on several APIs only available on main process, they must be provided by caller when it is called on non-main process.

To mimic the APIs, use @electron/remote module.

import {app, BrowserWindow, ipcMain} from '@electron/remote';

openAboutWindow({
    icon_path: 'path/to/icon.png'
    app,
    BrowserWindow,
    ipcMain,
});

Screen Shots

Linux

OS X

Windows

License

MIT License.