Angular IE11 Syntax error vendor.js (124116) class Dom7

[xergiu90]

Description

Opening the page on IE11 gives a SCRIPT1002: Syntax error inside vendor.js(124116,1)
If i open vendor.js at the row specified i find the class Dom7

My package.json files are:

"dependencies": {
"@angular/animations": "^6.0.3",
"@angular/common": "^6.0.3",
"@angular/compiler": "^6.0.3",
"@angular/core": "^6.0.3",
"@angular/forms": "^6.0.3",
"@angular/http": "^6.0.3",
"@angular/platform-browser": "^6.0.3",
"@angular/platform-browser-dynamic": "^6.0.3",
"@angular/router": "^6.0.3",
"@ng-bootstrap/ng-bootstrap": "^3.3.1",
"@types/file-saver": "^2.0.0",
"boosted": "^4.1.3",
"core-js": "^2.5.4",
"file-saver": "^2.0.0",
"jquery": "^3.3.1",
"ng-boosted": "^2.2.2",
"ng4-charts": "^1.0.2",
"ngx-cookie-service": "^1.0.10",
"ngx-filesaver": "^2.2.0",
"ngx-pagination": "^3.2.1",
"popper.js": "^1.14.6",
"rxjs": "^6.0.0",
"tablesorter": "^2.31.1",
"zone.js": "^0.8.26"
},
"devDependencies": {
"@angular-devkit/build-angular": "~0.6.8",
"@angular/cli": "~6.0.8",
"@angular/compiler-cli": "^6.0.3",
"@angular/language-service": "^6.0.3",
"@types/jasmine": "~2.8.6",
"@types/jasminewd2": "~2.0.3",
"@types/node": "~8.9.4",
"codelyzer": "~4.2.1",
"jasmine-core": "~2.99.1",
"jasmine-spec-reporter": "~4.2.1",
"karma": "~1.7.1",
"karma-chrome-launcher": "~2.2.0",
"karma-coverage-istanbul-reporter": "~2.0.0",
"karma-jasmine": "~1.1.1",
"karma-jasmine-html-reporter": "^0.2.2",
"protractor": "^5.4.2",
"ts-node": "~5.0.1",
"tslint": "~5.9.1",
"typescript": "~2.7.2"
}

🔥 Exception or Error

SCRIPT1002: Syntax error
vendor.js(124116,1)

🌍 Your Environment

Angular Version:
I am using Angular 4 with Maven Spring as backend

Anything else relevant?
Only happens on IE11 not on any other browser

I also enabled all in polyfills.ts
import 'core-js/es6/symbol';
import 'core-js/es6/object';
import 'core-js/es6/function';
import 'core-js/es6/parse-int';
import 'core-js/es6/parse-float';
import 'core-js/es6/number';
import 'core-js/es6/math';
import 'core-js/es6/string';
import 'core-js/es6/date';
import 'core-js/es6/array';
import 'core-js/es6/regexp';
import 'core-js/es6/map';
import 'core-js/es6/weak-map';
import 'core-js/es6/set';

And set the target to es5
"target": "es5",
"typeRoots": [
"node_modules/@types"
],
"lib": [
"es2017",
"dom"
]

[pkozlowski-opensource]

There is not enough info here for us to help and I'm not sure what Dom7 class is. Could you share larger snippet of code that fails?

[xergiu90]

@pkozlowski-opensource I have attached the console output and the class definition from vendor.js

[pkozlowski-opensource]

Hmm, hard to say for sure but it looks like your vendor bundle has code in ES2015 (look at class keyword) while IE11 doesn't support classes hence the syntax error. So it looks like something went wrong during the packaging / transiplation. I'm not sure how you are including the library in question and if you are using angular-cli but I would look into build for the problem solution.

In any case IE11 doesn't support classes and your vendor bundle contains ES2015 code with classes.

[xergiu90]

@pkozlowski-opensource Is there a way to figure out which library generates this ES2015 class? I am using angular-cli. Is there any other information that I can provide which could be helpfull?

[pkozlowski-opensource]

Is there a way to figure out which library generates this ES2015 class?

I'm sorry but it is super hard to help without having your project. I'm afraid that at this point you've got much more context to solve this problem than anyone else.

[xergiu90]

@pkozlowski-opensource But what other information do you need to debug this?

[Lausselloic]

hello @xergiu90 looks like this error is more due to the use of ng-boosted (https://github.com/Orange-OpenSource/Orange-Boosted-Angular)

I will create an issue in Ng-boosted you're not the only one with that error, it comes from swiper dependency

[xergiu90]

@Lausselloic you are completely right. After i removed the ng-boosted library it worked. Thanks for the insight. May I ask how you figured it out?