open-index/open-npm huggingface dataset:
npm package: @swirl/electron-builder
Description: This module contains a builder that supports building Angular applications targeted for electron. Specifically, this electron builder sets the webpack config's `target` option to `electron-renderer`. With minimal changes to your project's configuration yo
Latest version: 1.1.0

# Angular Electron Builder
This module contains a builder that supports building Angular applications targeted for electron.
Specifically, this electron builder sets the webpack config's `target` option to `electron-renderer`.
With minimal changes to your project's configuration you can use native node modules from within Angular applications that run using Electron.


## Installation
Follow these steps to setup an Angular application using this builder.

### 1. Create an Angular project
Create an Angular project by running `ng create`.
**You must use Angular CLI 6 or above.**

### 2. Clone this repository as a submodule
Clone this repository as a submodule by running:

```
git submodule init
git submodule add git@git.starlightconsultants.com:starlight-public/electron-builder.git electron-builder
```

### 3. Update your Angular configuration to use this builder
Edit your `angular.json` file, at the root of your project, and change the `builder` attribute on the project architect build entry.
Change the value of `builder` to `"builder": "./electron-builder:electron"`.
Your config file should look something like this:

```
"projects": {
  "app-name": {
    "architect": {
      "build": {
        "builder": "./electron-builder:electron",
	    ...
```

### 4. Update your app's TypeScript config to resolve node modules
Edit your application's TypeScript config at `src/tsconfig.app.json` and delete the empty `types` array if there is one in the `compilerConfig` object.


### 5. Install electron
Run `npm install --save electron`

### 6. Configure the application to load using relative URLs
Open the `src/index.html` file and change the `<base href="/">` tag to `<base href="./">`

### 7. Setup the Electron entry point
Create a file named `main.js` (or whatever you want really) and set it up to open an Electron browser window and load the `index.html` file in the dist folder.
For an example you can look at the [main.js](main.js) file in this repository (you can use this script as is **but make sure to change the app name to match the name of your app**)

Then edit your `package.json` file and set the `main` attribute to the path to your `main.js` file.
If `main.js` is in the root of your project then set `"main": "main.js"`.


## Building & Running your app
To build your app run `ng build`, `ng build --watch`, or `ng build --prod` just like you normally would.

To start Electron run `./node_modules/.bin/electron .` from the root of your project.