Skip to content
This repository has been archived by the owner on Jan 26, 2019. It is now read-only.

fix(wepack.config.prod.js): set ecma option for compress and output to 5 #297

Merged
merged 1 commit into from
Apr 9, 2018

Conversation

meandmax
Copy link

@meandmax meandmax commented Apr 8, 2018

The current configuration of UglifyJS breaks in IE11 under specific circumstances.

39d6c62

I simply copied the configuration of the create-react-app master (not yet merged) and tested it works just fine.

https://medium.com/@_meandmax_/react-16-cra-and-ie11-giving-me-headaches-c8be43b4fcb2

Here is the link to the discussion in CRA where you can also find the configuration:
facebook/create-react-app#4234

Was not so sure if this is the right way to do this, but 2.14 breaks in IE11.

@DorianGrey
Copy link
Collaborator

Just to note - there was already a bug report on this: #288

Background: uglifyjs applies optimizations affecting size with respecting the ecma version in its compress resp. output options. That also includes rewriting an object definition to a shorthand version in case this is natively supported in the provided ecma version. However, this contradicts the target version provided to the typescript compiler, and that's why you end up with minified ES6+ code even though the compiler was told to provide ES5-compatible output.

Theoretically, the best option would be to pick up the target version from the tsconfig and map it to the version number required here; however, that's something even more complicated...

I.e.: LGTM, thanks!

@thomastvedt
Copy link

thomastvedt commented Apr 19, 2018

So.. I love IE 11 and just upgraded "react-scripts-ts": "2.15.1", but when running yarn start I get this in IE11:

screen shot 2018-04-19 at 11 15 22

screen shot 2018-04-19 at 11 15 39

But this should use react-scripts-ts/config/webpack.config.dev.js right? And not the webpack.config.prod.js? I don't see any Uglify plugin in dev-mode?

The production build seems to work (start at least) in IE11, but how can I get a development environment up and running while testing in IE11?

tsconfig.json:

   {
     "compilerOptions": {
       "outDir": "build/dist",
    "module": "esnext",
    "target": "es5",
    "downlevelIteration": false, 
    "importHelpers": false,
    "lib": ["es6", "es2016", "dom", "dom.iterable", "es2015.iterable"],
    "sourceMap": true,
    "jsx": "react",
    "moduleResolution": "node",
    "rootDir": "src",
    "forceConsistentCasingInFileNames": true,
    "baseUrl": "src",
    "noImplicitReturns": true,
    "noImplicitThis": true,
    "noImplicitAny": true,
    "strictNullChecks": true,
    "suppressImplicitAnyIndexErrors": true,
    "noUnusedLocals": false,
    "allowSyntheticDefaultImports": true,
    "removeComments": true,
    "strict": false
  },
  "exclude": [
    "node_modules",
    "build",
    "dist",
    "scripts",
    "acceptance-tests",
    "webpack",
    "jest",
    "src/setupTests.ts"
  ]
}

Sign up for free to subscribe to this conversation on GitHub. Already have an account? Sign in.
Labels
None yet
Projects
None yet
Development

Successfully merging this pull request may close these issues.

3 participants