Babel 7 modules UMD - why transpeiler defines global item in lower case and how to avoid it?

Question

This using Babel 7 (configured for modules UMD)

import '@babel/polyfill';
import Popper from 'popper.js';

was transpiled to

(function (global, factory) {
  if (typeof define === "function" && define.amd) {
    //...
  } else {
    var mod = {
      exports: {}
    };
    factory(global.polyfill, global.popper);
    global.site = mod.exports;
  }
})(/* ... */);

There global.popper is in low case, when popper.js lib define itself in global as global.Poopper - first letter is in upper case.

I have read something about such UMD problems a year ago - but now can't find details in internet. So please show me direction how to avoid such problems (without using Rollup and its tooling).

P.S. global.polyfill is also nonsense.

Actually I'm just trying to use Babel without webpack and requirejs in "old fashion way" - transpile file by file to js folder and then load every script with <script>. Just as reasearch of its tooling. But it is surprisingly hard.

Answer 1

I added @babel/plugin-transform-modules-umd to my .babelrc. This plugins lets you specify global variables aliases. here's plugin documentation

Now my .babelrc file looks like this:

{
    "presets": [
        "@babel/preset-env",
        "@babel/preset-typescript"
    ],
    "plugins": [
        [
            "@babel/plugin-transform-modules-umd",
            {
                "globals": {
                    "vue": "Vue"
                }
            }
        ],
        "@babel/proposal-class-properties",
        "@babel/proposal-object-rest-spread"
    ]
}