CODEWITHSUNDEEP
javascriptinternet-explorer-11babeljses6-class
vector
vector

Reputation: 199

How to use browser.js to solve es6 class issue in IE 11

I am using javascript classes and ran into the SCRIPT1002 issue in IE 11, where IE is unable to interpret the 'class' keyword that is available in es6. I have been reading that using babel is a way to work around this unfortunate issue. However, I am having issues understanding how to properly do this. below is my code. What do I need to add to allow IE 11 to properly interpret a js class?

header including babel.js (browser.js is being loaded properly)

<!-- babel -->
<script type="text/babel" src="<?php echo  $GLOBALS["COMMON_ROOT"]; ?>/scripts/babel-5.8.29/browser.js"></script>

class in javascript file casuing the SCRIPT 1002 error

class assessmentAnswer {
    constructor(answerID, questionID, answerText, imagePath) {
      this._answerID = answerID;
      this._questionID = questionID;
      this._answerText = answerText;
      this._imagePath = imagePath;
    }

    getAnswerID(){
        return this._answerID;
    }

    getQuestionID(){
        return this._questionID;
    }

    getAnswerText(){
        return this._answerText;
    }

    getImagePath(){
        return this._imagePath;
    }

    getAll(){
        return this.getAnswerID()+","+this.getQuestionID()+","+this.getAnswerText()+","+this.getImagePath();
    }
}

This code runs fine in Firefox.

Upvotes: 0

Views: 2528

Answers (1)

Tamas Hegedus
Tamas Hegedus

Reputation: 29906

Don't even try to run babel in ie. It will be awfully slow. Use a compiler toolchain (babel) to create an offline build process, and serve the compiled files. It's true that all modern browsers understand the class keyword, but until you have to support at least one browser that doesn't, you will have to compile. The babel compiler is a complex javascript program, I am sure you don't want to include additional hundreds of kilobytes of js code in your web application. Offline compilation is the way to go.

You may wonder why is even babel capable of doing it in the browser: well it was created to support some developer workflows, but nowadays it is mostly unnecessary as browsers implement most of the es6 spec and some esnext specs like async/await too.

This so thread should help you to get started: Do I need require js when I use babel?

Upvotes: 1

Related Questions