Geek Answers Handbook

Polymer 2 and Cordoba

I am trying to create a hybrid application using Polymer 2.0. I used a polymer-2 sample and a polymer-2 starter kit sample, and it worked when it was tested in the Safari browser.

Safari browser

But when I run it on the iOS simulator, the Polymer element did not display.

enter image description here

Here is my example index.html

<!DOCTYPE html> <html> <head> <meta name="format-detection" content="telephone=no"> <meta name="msapplication-tap-highlight" content="no"> <meta name="viewport" content="width=device-width, minimum-scale=1, initial-scale=1, user-scalable=yes"> <link rel="stylesheet" type="text/css" href="css/index.css"> <meta name="description" content="TestPolymer-2 description"> <link rel="manifest" href="/manifest.json"> <script src="bower_components/webcomponentsjs/webcomponents-loader.js"></script> <link rel="import" href="src/test-element/test-element.html"> <title>Hello World</title> </head> <body> <div class="app"> <test-element></test-element> <h1>Apache Cordova</h1> <div id="deviceready" class="blink"> <p class="event listening">Connecting to Device</p> <p class="event received">Device is Ready</p> </div> </div> <script type="text/javascript" src="cordova.js"></script> <script type="text/javascript" src="js/index.js"></script> </body> </html>
+8
cordova
source share
1 answer

The problem is that Polymer 2 HTML Imports does not work on iOS <10.3. To make it work, you will need Polyfill .

See Polymer 2 Support Chart .

In addition, Polymer 2 uses ES6, which is only supported on iOS 10+, in order to use it on iOS 9, you must compile your application into ES5 .

But with iOS 10 having 86%, I would recommend just disabling iOS 9 and only support iOS 10 in your application.

+1
source share

More articles:


All Articles