Babel 6.0.20. Модули не работают в IE8

Я пытаюсь экспортировать модуль es6 в header.js:

export default {
    setHeaderHighlight: function (index) {
        // do somethings
    }
};

И импортируйте его в index.js:

import header from "./header.js"

$(function () {
    header.setHeaderHighlight(0);
});

Затем преобразование происходит в index.bundle.js:

var _header = __webpack_require__(129);

var _header2 = _interopRequireDefault(_header);

function _interopRequireDefault(obj) {
    return obj && obj.__esModule ? obj : { default: obj }; // crash here
}

Итак, вот проблема: ie8 будет поднимать Expected identifier Exception at { default: obj }, но все в порядке >= ie9.

Есть ли что-то, что я могу сделать с этим?

Ответ 1

По умолчанию Babel 6.x требует, чтобы вы включили явный набор преобразований. Стандартная предустановка es2015 преобразует ES6 в ES5, однако IE8 не совместим с ES5. В этом случае, если вы посмотрите на список плагинов, вы увидите

Они преобразуют ваши свойства для совместимости с IE8. Как правило, в Babel 6.x вы сделали бы это, передав эти имена как часть вашего массива plugins вместе с массивом presets и установив преобразования через

npm install --save-dev babel-plugin-transform-es3-member-expression-literals babel-plugin-transform-es3-property-literals

Ответ 2

Я использую webpack + es3ify-loader как обходной путь.

loaders: {
  {
    test: /\.jsx?$/,
    exclude: /node_modules/,
    loaders: ['es3ify', `babel?${JSON.stringify(babelQuery)}`],
  },
}

Ответ 3

У меня также есть проблема, и я написал плагин webpack, чтобы решить эту проблему. Я действительно не знал, есть ли более хороший способ справиться с этим, но он работает.

Модуль в node_modules также хорошо работает.