sveltejs/sapper

Shimport not transpiled

Closed this issue · 16 comments

Describe the bug
See #1525 (comment)

To Reproduce
Load the site in IE11

Expected behavior
The javascript should run without issue.

Information about your Sapper Installation:

  • Your browser

Internet Explorer 11

Severity
Critical - IE support is broken in Sapper and I don't believe the user is able to work around it.

This seems more likely to be an issue in the template or in https://github.com/antony/sapper-ie than in Sapper. I don't think anything changed in Sapper other than upgrading the version of Shimport and Shimport has had const for a long time

I thought const was mostly supported in IE11? https://caniuse.com/?search=const. It's weird because I was testing with IE11 on browser stack and hadn't seen any issues. I wonder if your config doesn't match what's in https://github.com/antony/sapper-ie ?

I'm not running sapper-ie, I'm using the official template. That error is from a degit and build and node__sapper__/server of sapper-template

Maybe we need to update the official template to match sapper-ie? I see the official template has presets in the rollup config and you moved it to babel.config.json

Btw 'Const' is probably not the issue, it's unreliable in IE but does work. But there is an issue with the code, hence the error. Ie makes it hard to diagnose as it doesn't show a character reliably.

Maybe we need to update the official template to match sapper-ie? I see the official template has presets in the rollup config and you moved it to babel.config.json

So I've tried this and it didn't help. Rollup never sees shimport. I'm trying to find out why at the moment.

Hmm. Does sapper-ie work for you? That's what I had used to test. Maybe you're missing the polyfills if you're using the template?

I'm observing similar behaviour in Safari 9.1. Console showing SyntaxError: Unexpected use of reserved word 'let' in strict mode coming from shimport@2.0.3.js. Examining source shows shimport is not transpiled.

Was shimport transpiled with older versions of Sapper?

Yes, can confirm. Looking at a Sapper v0.27.x app and in shimport@1.0.1 all let/const symbols are transpiled to var.

Looks like IE won't say what the syntax error is, it just highlights the entire shimport.js file as a syntax error. These aren't affected by polyfills however, they're non-executable script, so it's going to be something along the lines of a reserved keyword like import or async or something. The file almost certainly needs transpiling.

You might try various versions of Sapper to figure out when it stopped being transpiled. It's super weird to me that it would change. I can't think of anything in Sapper that would affect that

It looks like it was never transpiled, it just used to be compiled+published in a way that was compatible with IE11.

https://www.npmjs.com/package/shimport/v/1.0.1
https://www.npmjs.com/package/shimport/v/2.0.3

It's using arrow functions, that's the root cause. I don't know why shimport version 2.0.3 was written in es6 syntax but I'm fairly sure that defeats the purpose of it?

I figured this out by grabbing the source for both shimports and simply sticking them in a script tag in IE11.

I'm guessing we should be transpiling it at source - I'll raise a bug on the shimport project.

My guess is that it stopped being transpiled when switching from the typescript plugin to the sucrase plugin. I bet you could switch that back and it'd get transpiled again

https://github.com/Rich-Harris/shimport/blob/37c2164b752a09ff03d89cc7a936a7cd0b0da0a0/tsconfig.json#L9

Here's the issue: Rich-Harris/shimport#34

This should be fixed in Shimport 2.0.4.