Ember Cli - Added Polyfill Internet Explorer Error Object Expected - ember.js

Question

I have a problem and I don't see someone who has this kind of problem with this.
Basically I made a helper to format a date, it has some syntax of EcmaScript like let, or expoorts.
Its working in all the browsers except INTERNET EXPLORER, so I though ok its time to configure Polyfill, so I read the documentation to configure it with ember-cli-babel and I am not able to see the results as expected.
I have an ember app, with ember cli
DEBUG: -------------------------------
DEBUG: Ember : 2.14.1
DEBUG: jQuery : 2.2.4
DEBUG: -------------------------------
I include POLYFILL in my broccoli file like this
ember-cli
var EmberApp = require('ember-cli/lib/broccoli/ember-app');
module.exports = function(defaults) {
var app = new EmberApp(defaults, {
'ember-cli-babel': {
includePolyfill: true
},
storeConfigInMeta: false,
minifyJS: {
enabled: false
},
minifyCSS: {
enabled: false
},
vendorFiles: {
'jquery.js': {
development: 'bower_components/jquery/dist/jquery.js',
production: false,
development: false
}
}
});
app.import('vendor/jquery.lumanetix.all.min.js');
return app.toTree();
};
I have a ember helper to format a date here it is:
import Ember from 'ember';
export function dateAuctionFormat(date/*, hash*/) {
let dateObj = new Date(date);
let monthName = getMonthName(dateObj.getUTCMonth());
let dayNumber = dateObj.getUTCDate();
dayNumber = dayNumber + formatDateNotation(dayNumber);
let dayName = getWeekDayName(dateObj.getDay());
let time = dateObj.toLocaleString('en-US', { hour: 'numeric', minute:'numeric', hour12: true });
return dayName + ' ' + dayNumber + ' ' + monthName + ' ' + time;
}
function getMonthName(date) {
let month = [];
month[0] = "Jan";
month[1] = "Feb";
month[2] = "March";
month[3] = "April";
month[4] = "May";
month[5] = "June";
month[6] = "July";
month[7] = "Aug";
month[8] = "Sept";
month[9] = "Oct";
month[10] = "Nov";
month[11] = "Dec";
return month[date];
}
function getWeekDayName(date) {
let weekday = new Array(7);
weekday[0] = "Sunday";
weekday[1] = "Monday";
weekday[2] = "Tuesday";
weekday[3] = "Wednesday";
weekday[4] = "Thursday";
weekday[5] = "Friday";
weekday[6] = "Saturday";
return weekday[date];
}
function formatDateNotation(d) {
if (d > 3 && d < 21) {
return 'th';
}
switch (d % 10) {
case 1: return "st";
case 2: return "nd";
case 3: return "rd";
default: return "th";
}
}
export default Ember.Helper.helper(dateAuctionFormat);
But when Internet Explorer 11 is rendering the site, I have an error in the debugger like this:
The error said Object Expected.
and you can see the error showing just after the line
export default App.extend({
// rootElement: '#listings-search'
});
So I don't know from where start, I try to modify a little bit, app.js, but no luck, also I tried to convert my ES6 code to ES5 with this converter:
https://babeljs.io/repl/
But of course it didn't work and also its not the idea.

Answer 1

I believe you need to add target to your targets config. You can use this list:
https://github.com/ai/browserslist#queries
This targets file is later used by Babel to determine which features are supported by browsers and this later affects transpiled JavaScript.