How to configure routes in a Chrome extension using Ember CLI?

We are developing a Chrome extension using Ember CLI, but are having difficulty getting the routes/resources to play nicely with Chrome as the Index route is not being fired correctly.

The steps we have taken:

• Create the default application using Ember CLI: ember new myapp
• We do not define any routes as we should get the Index generated for us
• Build: ember build --environment production
• Put a manifest.json file to define the extension in the dist/ folder
• In Chrome we 'Load an unpacked extension...' and point it to the dist/ folder

Normally, if the Ember application was hosted on a server, going to where Ember serves the application, like hxxp://localhost:4200/, would load the application and all routes would hang off that.

However, as it's a Chrome extension, it doesn't load the index.html when using the empty route, such that going to http://chrome-extension(extension_id)/ gives an error 'This webpage is not found' as I presume Chrome doesn't redirect to index.html by default.

If you point the extension to http://chrome-extension(extension_id)/index.html it loads the Ember application, but then Ember gives an error:

Uncaught UnrecognizedURLError: /index.html

One way round this is to define an 'index.html' route in the router as below, but this isn't ideal:

Router.map(function() {
      this.resource('index', { path: '/index.html' });
});

Is there a way to correctly define the routes?

Any help would be very much appreciated!