Измененное поведение экспорта по умолчанию в Babel 6: переход от удобства к семантической согласованности

В результате революционного изменения Babel 6 пересмотрел свой подход к экспорт значений по умолчанию, что приводит к переходу от предыдущего поведения, основанного на CommonJS, к строгим принципам ES6. Это изменение создало как возможности, так и проблемы для разработчиков.

Ранее Babel добавлял строку «module.exports = Exports['default']» к декларациям экспорта по умолчанию, позволяя разработчикам получать к ним доступ как «require( './foo')" напрямую. Однако с появлением Babel 6 эта практика была прекращена. Теперь для доступа к экспорту по умолчанию требуется явное соглашение об именовании: «require('./foo').default».

Последствия и обходные пути

Это изменение привело к созданию необходимость модификации кода в проектах, которые опирались на предыдущее поведение. Хотя во многих случаях желательно использовать синтаксис импорта/экспорта ES6, для некоторого устаревшего кода могут потребоваться альтернативные решения.

Чтобы сохранить старую функциональность без необходимости исправлений вручную, можно использовать «babel-plugin-add-module- плагин экспорта. Этот плагин повторно вставляет строку «module.exports = Exports['default']», эмулируя механизм экспорта до версии Babel 6.

В качестве альтернативы разработчики, которые сталкиваются с проблемой, когда именованный экспорт ведет себя по-разному в ES6, могут явно экспортировать экспорт не по умолчанию, чтобы предотвратить объект модуля переопределения.

Пример:

Ввод:

const foo = {}
export default foo

Вывод с помощью Babel 5:

"use strict";

Object.defineProperty(exports, "__esModule", {
  value: true
});
var foo = {};
exports["default"] = foo;
module.exports = exports["default"];

Вывод с помощью Babel 6 (и плагина es2015):

"use strict";

Object.defineProperty(exports, "__esModule", {
  value: true
});
var foo = {};
exports["default"] = foo;

Заключение

Измененное поведение экспорта по умолчанию в Babel 6 обеспечивает соблюдение семантики ES6, способствует согласованности и позволяет избежать путаницы. Хотя это требует некоторых корректировок кода, в конечном итоге это способствует принятию современных стандартов и практик JavaScript.