I have some jQuery and JavaScript and when I try to compress the JavaScript I get an error saying Unexpected character '`'

I tried two JavaScript compressors but both gave me the same error

I don't know what is the cause of my error:

Here is my code:

// Login Form Sumbission
$("#loginForm").submit(function (event){

    $("#loginButton").prop("disabled", true);
    $("#loginButton").html(`<div  role="status"><span >Loading...</span></div> Submit`);
    $("#loginEmail").off("input")
    $("#loginPassword").off("input")

    let formData = {
        "csrfmiddlewaretoken": $('#loginForm input[name=csrfmiddlewaretoken]').val(),
        "email": $("#loginEmail").val(),
        "password": $("#loginPassword").val(),
    };

    $.ajax({
        type: "POST",
        url: "/accounts/login/",
        data: formData,
        dataType: "json",
        encode: true,
    }).done(function (data){
        var status = data["status"];

        // If The User Successfully Logged In
        if (status === "success"){

            // Update Navigation Bar
            $("#navbar").replaceWith(data["navbarHtml"]);
            $("#loginModal button.btn-close").click();
            $("#modals").remove();

            // Update Other Things On The Web Page Base On Thier Path
            let path = window.location.pathname;

            if (path in data){
                var updateData = data[path]
            }
            else{
                var updateData = {}
            };

            for (item in updateData) {
                $(item).replaceWith(updateData[item]);             
            };

            $("#messages").html(`
            <div style="margin-bottom: 0px"  role="alert" id="messages">
                <strong >${data["message"]}</strong>
                <button type="button"  data-bs-dismiss="alert" aria-label="Close"></button>
            </div>`)

        };
    });

    event.preventDefault();
});

CodePudding user response：

The error Unexpected character '`' is from the parser of the compressor.

I can't say for sure from which one (the site uses UglifyJS 2 and YUI) but I would guess it is YUI (its development has stopped several years ago).

YUI will fail to parse and compress modern JavaScript, it does not know about let and const, does not know `, await/async, …

So the solution will be to limit yourself to the features the compressor knows or to use a compressor that knows the features you use.

Which one to choose is out of the scope of StackOverflow (Terser, UglifyJS 3 and Google Closure Compiler are possible candidates all with their pros and cons)