Ionic2 Web App to Chrome App?

I successfully created an iphone app with ionic2.
I also made a web app version of it online.

now I feeling brave to create chrome app out of it…
naturally i thought i wouldnt be difficult at all, basically just a packaged offline webapp working inside a browser…

I followed the chrome document. Created a manifest.json and point it to the index.html file built from ionic.

but then this happened:

The errors are… overwhelming…

I m new to programming.
I did successfully created the iphone app, learning by doing, yet I couldnt make sense of these errors.

after digging around, I guess there are some permission problems in chrome.
mainly caused by the EvalError I guess, but i hv no idea what to do next to fix it.

Did anyone try building a chrome app before with ionic 2?
If so, any pointers? I understand this is not an ionic 2 issue, but more about chrome.
appreciate if someone here offers some insights to help me get this working.

or is this just impossible to build a chrome app with ionic2?

I built a chrome app with angular 1.x before, I forgot how i fixed it but it was rather straight forward, only to set permission in the manifest.json. however it looks different this time and very few ppl talked about building chrome app with ionic2.

You might want to look at this article:

I would recommend looking at PWAs. There are some blog posts on the Ionic site about getting started with them.


1 Like

After some digging around I found the solution to it. it was easier than i thought.

an ionic app can be ported to Chrome app with no issues at all (in my case at least).
hvn’t tried uploading it to the chrome store yet but it worked perfectly on my local machine.

the app is built with the command ionic build browser.

here’s my manifest.json:
{ "name": "Cards of War", "description": "A graphic adaptation of Suntzu's The Art of War", "version": "0.1", "manifest_version": 2, "app": { "launch": { "local_path": "index.html", "scripts": ["cow.js"] } }, "icons": { "16": "img/icon16.png", "128": "img/logo.png" }, "content_security_policy": "script-src 'self' 'unsafe-eval'; object-src 'self'" }

the magic is the line:
"content_security_policy": "script-src 'self' 'unsafe-eval'; object-src 'self'"

again I am new to coding so i m not so sure what is happening that fixed all the errors.

but this works.
I hope this could help some others who looking to create chrome apps.:slight_smile:

thx for your reference about google killing chrome apps.
The way i work around it is to wrap the app up to be loaded as an extension.
Google is only killing the app launcher but extension will be supported cross platforms for a foreseeable future.

Hello, to avoid any confusion, the line

"content_security_policy": "script-src 'self' 'unsafe-eval'; object-src 'self'"

only works for Chrome Extensions, not Chrome Apps.

I actually have the same problem but my need is to create a packaged Chrome App. This is the warning I get when adding that line :

There were warnings when trying to install this extension:

* 'content_security_policy' is only allowed for extensions and legacy packaged apps, but this is a packaged app

Can you please tell me more about this work around (wrapping the app to be loaded as an extension) ?
Also can you please explain me how you can create the app using ionic build browser command? That would be super cool
Thank youuu!!! :smiley:

1 Like

Same here… I am no longer able to use the steps mentioned above with ionic 2 final. Is there any changes in the manifest.json we need to implement?

1 Like