NWjs - Building Angular 2 Desktop Apps

Question

I am trying to build an Angular 2 Desktop App with NWjs. What is the entry point?

Any examples of Building Angular 2 Desktop Apps with NW.js

Answer 1

You should create app that runs locally in your browser when You run eg. index.html

Then You can like mentioned in getting started set in package.json:

{
  "name": "helloworld",
  "main": "index.html"
}

And run app:

Step 3. Run your app

cd /path/to/your/app

/path/to/nw .

Happy hacking!

Answer 2

A proper setup for those who want to develop Desktop Apps using Angular2 & NW.js

NW.js allows the developer to specify either a template (e.g. index.html) or an entry script like you mentioned.

I advise you to go check the awesome NW.js Community Projects on https://nwutils.io

There is on there an example NW.js Angular2 Boilerplate App you should refer to: https://github.com/nwutils/nw-angular-cli-example

A typical way to follow when developing NW.js Apps using Angular2 is to set an entry script entry.js. During development, serve your Angular App like you would in a normal Angular setup (i.e. ng serve), and run your NW.js App with a --development flag, and with the following entry script:

const settings = {
  title: 'NW.js Angular2 Boilerplate',
  frame: true,
  width: 800,
  height: 600
};


if (nw.App.argv.includes('--development')) {
  // start your NW.js App with a --dev flag during development.
  // since you're serving your Angular App, tell NW.js to open your locally served Angular App

  nw.Window.open(
      'localhost:4200',
      settings,
      (win) => win?.showDevTools(),
  );
} else {
  // otherwise, after your build your Angular App, you tell NW.js to open the built index.html inside your build folder (usually called dist)
  
  nw.Window.open(
      'dist/index.html',
      settings,
      (win) => {},
  );
}

Point your package.json to your entry.js script:

{
  name: 'NW.js Angular2 App',
  main: 'entry.js'
}