Copyright © 2016, Regents of the University of California
All rights reserved.
Redistribution and use in source and binary forms, with or without modification, are permitted provided that the following conditions are met:
- Redistributions of source code must retain the above copyright notice, this list of conditions and the following disclaimer.
- Redistributions in binary form must reproduce the above copyright notice, this list of conditions and the following disclaimer in the documentation and/or other materials provided with the distribution.
- Neither the name of the University of California nor the names of its contributors may be used to endorse or promote products derived from this software without specific prior written permission.
THIS SOFTWARE IS PROVIDED BY THE COPYRIGHT HOLDERS AND CONTRIBUTORS "AS IS" AND ANY EXPRESS OR IMPLIED WARRANTIES, INCLUDING, BUT NOT LIMITED TO, THE IMPLIED WARRANTIES OF MERCHANTABILITY AND FITNESS FOR A PARTICULAR PURPOSE ARE DISCLAIMED. IN NO EVENT SHALL THE COPYRIGHT OWNER OR CONTRIBUTORS BE LIABLE FOR ANY DIRECT, INDIRECT, INCIDENTAL, SPECIAL, EXEMPLARY, OR CONSEQUENTIAL DAMAGES (INCLUDING, BUT NOT LIMITED TO, PROCUREMENT OF SUBSTITUTE GOODS OR SERVICES; LOSS OF USE, DATA, OR PROFITS; OR BUSINESS INTERRUPTION) HOWEVER CAUSED AND ON ANY THEORY OF LIABILITY, WHETHER IN CONTRACT, STRICT LIABILITY, OR TORT (INCLUDING NEGLIGENCE OR OTHERWISE) ARISING IN ANY WAY OUT OF THE USE OF THIS SOFTWARE, EVEN IF ADVISED OF THE POSSIBILITY OF SUCH DAMAGE.
built with:
A minimalistic yet comprehensive boilerplate application for Electron runtime. Tested on macOS, Windows and Linux.
This project does not impose on you any framework (like Angular or React). It tries to give you only the 'electron' part of technology stack so you can pick your favorite technologies to build the actual app.
The only development dependency of this project is Node.js, so just make sure you have it installed. Then type few commands known to every Node developer...
git clone https://github.com/szwacz/electron-boilerplate.git
cd electron-boilerplate
npm install
npm start
... and boom! You have a running desktop application on your screen.
The application is split between two main folders...
src
- this folder is intended for files which need to be transpiled or compiled (files which can't be used directly by Electron).
app
- contains all static assets (put here images, css, html etc.) which don't need any pre-processing.
The build process compiles all stuff from the src
folder and puts it into the app
folder, so after the build has finished, your app
folder contains the full, runnable application.
Treat src
and app
folders like two halves of one bigger thing.
The drawback of this design is that app
folder contains some files which should be git-ignored and some which shouldn't (see .gitignore
file). But thanks to this two-folders split development builds are much (much!) faster.
npm start
The version of Electron runtime your app is using is declared in package.json
:
"devDependencies": {
"electron": "1.4.7"
}
Side note: Electron authors advise to use fixed version here.
Build process is founded upon gulp task runner and rollup bundler. There are two entry files for your code: src/background.js
and src/app.js
. Rollup will follow all import
statements starting from those files and compile code of the whole dependency tree into one .js
file for each entry point.
You can add as many more entry points as you like (e.g. to split your app into modules).
By the way, rollup has a lot of plugins. You can add them in this file.
Remember to respect the split between dependencies
and devDependencies
in package.json
file. Only modules listed in dependencies
will be included into distributable app.
Side note: If the module you want to use in your app is a native one (not pure JavaScript but compiled C code or something) you should first run npm install name_of_npm_module --save
and then npm run postinstall
to rebuild the module for Electron. This needs to be done only once when you're first time installing the module. Later on postinstall script will fire automatically with every npm install
.
Thanks to rollup you can (and should) use ES6 modules for all code in src
folder. But because ES6 modules still aren't natively supported you can't use them in the app
folder.
Use ES6 syntax in the src
folder like this:
import myStuff from './my_lib/my_stuff';
But use CommonJS syntax in app
folder. So the code from above should look as follows:
var myStuff = require('./my_lib/my_stuff');
npm test
Using electron-mocha test runner with the chai assertion library. This task searches for all files in src
directory which respect pattern *.spec.js
.
npm run e2e
Using mocha test runner and spectron. This task searches for all files in e2e
directory which respect pattern *.e2e.js
.
npm run coverage
Using istanbul code coverage tool.
You can set the reporter(s) by setting ISTANBUL_REPORTERS
environment variable (defaults to text-summary
and html
). The report directory can be set with ISTANBUL_REPORT_DIR
(defaults to coverage
).
Electron can be plugged into CI systems. Here two CIs are preconfigured for you. Travis CI tests on macOS and Linux, App Veyor tests on Windows.
To package your app into an installer use command:
npm run release
It will start the packaging process for operating system you are running this command on. Ready for distribution file will be outputted to dist
directory.
You can create Windows installer only when running on Windows, the same is true for Linux and macOS. So to generate all three installers you need all three operating systems.
All packaging actions are handled by electron-builder. It has a lot of customization options, which you can declare under "build" key in package.json file.
Released under the MIT license.