2.1.0 breaks IE11

[davidspiess]

After upgrading to 2.1.0 from 2.0.4 IE11 throws:
"Const must be initialized error"

I think the main culprit is the free-style dependency which uses const in for loops.

https://github.com/blakeembrey/free-style/blob/master/src/index.ts#L257

[davidspiess]

Free-style ticket for reference: blakeembrey/free-style#82

[davidspiess]

The author from free-style was very kind to release an ES5 compatible build https://github.com/blakeembrey/free-style/releases/tag/v3.2.2
Would it be possible to update typestyle with this version?

[basarat]

Sorry for the late reply. The following will need to be done:

• update FreeStyle - straightforward
• there will need to be an additional build created for es5 (there are already two builds Commonjs + ESModule) - straightforward
• Create code mod that takes the current src and modifies each import from 'free-style' to be from 'free-style/dist.es5' - will require some thought / time

PR would be appreciated 🌹

[teramotodaiki]

I found a workaround with Webpack. If you want to solve it right now, please refer to it.

• Upgrade free-style up to v3.2.2. e.g. npm install --save free-style@latest
• Add resolve.alias field to webpack.config.js.

resolve: {
  alias: {
    'free-style': 'free-style/dist.es5/index.js' // avoid es2015 build
  }
}

[teramotodaiki]

I'm sorry but above workaround may occur another bug. In my case, typestyle's style() with media() generate same hash even different media queries.

Here is a easy workaround for this bug.

import { style, media } from 'typestyle';

const classA = style(media({ minWidth: 600 }, { display: 'none' }));
const classB = style(media({ maxWidth: 601 }, { display: 'none' })); // === classA
const classC = style(media({ maxWidth: 601 }, { display: 'none', opacity: 100 })); // !== classA

[craigkovatch]

@basarat would you be opposed to a fix where typestyle just chooses to both consume the es5-compatible free-style artifact and target es5 itself? Seems like that would be easiest for all scenarios until IE11 finishes dying off.

[craigkovatch]

@basarat friendly reminder a year later :) ^