Как перенести импорт jQuery из ECMA6 в оболочку UMD с помощью Babel?

Я пытаюсь использовать Babel для переноса импорта jQuery из ECMA6 в оболочку UMD.

Мои источники ECMA6 выглядят следующим образом:

import {jQuery as $} from jquery;

<payload>

и Вавилон передает это:

(function (global, factory) {
  if (typeof define === "function" && define.amd) {
    define(['jquery'], factory);
  } else if (typeof exports !== "undefined") {
    factory(require('jquery'));
  } else {
    var mod = {
      exports: {}
    };
    factory(global.jquery);
    global.metisMenu = mod.exports;
  }
})(this, function (_jquery) {
  'use strict';

  var _jquery2 = _interopRequireDefault(_jquery);

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

  var _typeof = typeof Symbol === "function" && typeof Symbol.iterator === "symbol" ? function (obj) {
    return typeof obj;
  } : function (obj) {
    return obj && typeof Symbol === "function" && obj.constructor === Symbol && obj !== Symbol.prototype ? "symbol" : typeof obj;
  };

  function _classCallCheck(instance, Constructor) {
    if (!(instance instanceof Constructor)) {
      throw new TypeError("Cannot call a class as a function");
    }
  }

  <payload>(_jquery.jQuery);

  })

Этот код прекрасно работает в среде Node.js как require('jquery') принимает JQuery от node_modules,

Однако в среде браузера global.jquery (что эквивалентно window.jquery) не определено - jquery импортирует себя как $ или же jQuery, но не как jquery,

Есть ли какие-либо настройки Babel, чтобы это исправить?

Мой текущий .babelrc

{
    "presets": [
        ["env", {
            "modules": "umd",
            "loose": true
        }]
    ]
}

1 ответ

Решение

Вы должны использовать globals вариант в transform-es2015-modules-umd плагин:

{
  "plugins": [
    ["transform-es2015-modules-umd", {
      "globals": {
        "jquery": "jQuery"
      }
    }]
  ]
}

Смотрите документы.

Другие вопросы по тегам