Framework7-Vue won't render in iOS 10 Safari

Questions
1

In Google Chrome on Windows, my app renders just fine. The same app in Chrome or Safari in iOS 10 does not render at all.

To demonstrate, I made an SSCCE. Please hit the following URL on Chrome on a desktop/Windows, and try also on iOS 10. For me, it won’t render in iOS Safari or Chrome.

http://mbplautz.github.io/dist/

2

Update: The above URL renders without error on iOS 11 Safari.

I’m not sure what it is about iOS 10 Safari (or Chrome).

3

From what i see you didn’t transpile JS from ES-next to ES5 syntax. You need to use some transpile for production like Babel or Buble

4

Thanks for catching onto that - this was not obvious to me.

The fact that it works on iOS 11 and not iOS 10 appears to be due to the Javascript dynamic modules import not being supported in iOS Safari 10, (see https://caniuse.com/#search=Javascript%20modules%20dynamic).

Rather than change the transpilation target, I will just require iOS 11 minimum for now (since iOS is at 12).

5

Not just imports but a lot of ES-next features like Classes, const, let, etc. And you should always transpile code to ES5 syntax for production! Because since some of not supported ES-next language feature will be introduced in f7 source it can also break your iOS 12 and later app