Fable not compatible with IE 11

[halcwb]

Description

Fable seems not to be compatible with IE 11 with regard to using fetch.

Repro code

Install a setup using safe-stack on a windows machine with IE 11. Create the sample counter project using safe stack. Start up VS code and do a fake build -t run.

Expected and actual results

The expected result is that the counter object can be fetched. Instead the loading message keeps showing and in the console there is an error:

SCRIPT5009: fetch is not defined

Related information

• Fable version: yarn info v1.13.0 2.1.11
• Operating system: Windows 7 Enterprise, Servicepack 1

[MangelMaxime]

IE11 doesn't support fetch natively you will have to install a polyfill in order to use it.

This is related to how JavaScript works and not Fable.

In order to include fetch polyfill there is several solution:

1. Easy solution is to use an "automated web service" like polyfiller. So including <script src="https://polyfill.app/api/polyfill?features=fetch"></script> in your.html file should do the trick and includefetch polyfill if yours browser doesn't have it natively.

2. Use a polyfill from npm directly like whatwg-fetch and require it from your webpack config: entry: [ "whatwg-fetch", "./src/myProject.fsproj", ...others polyfills]

[halcwb]

Thanks for your quick reply. Used your suggested polyfill and works very well.

[theimowski]

@MangelMaxime @alfonsogarciacaro quick question on this: Should webpack-config-template in current shape include fetch polyfills for IE11?

Or does one need to add "whatwg-fetch" anyway?

[MangelMaxime]

I don't think it should include polyfills for IE11 or fetch.

This is up to the user to know what polyfills should be added in is configuration depending on its need.

[alfonsogarciacaro]

Thank you all for you help! I'd also like to mention that Fable.SimpleHttp is an alternative to Fable.Fetch that uses XMLHttpRequest so it's directly compatible with IE 11 without polyfills.

@theimowski As Maxime says, it's better not to add the polyfill by default because this depends on a library, and other libraries may require other specific polyfills. However we could add a note in the comment about this.

[theimowski]

Thanks for the answers.

Yeah I forgot about Fable.SimpleHttp - that's indeed a nice alternative!

I added https://github.com/fable-compiler/webpack-config-template/pull/13 to improve the comments as I was mislead by This adds polyfills when needed. comment, which I understood it would add the fetch polyfills as well.