Babel @babel/plugin-transform-runtime - Use in the browser

I am confused about the use Babel plugin @babel/plugin-transform-runtime in the browser.

This is my .babelrc file:

{
  "presets": [
    [
      "@babel/preset-env",
      {
        "modules": false,
        "targets": {
          "esmodules": true
        }
      }
    ]
  ],
  "plugins": [
    [
      "@babel/plugin-transform-runtime",
      {
        "absoluteRuntime": false,
        "corejs": false,
        "helpers": true,
        "regenerator": true,
        "useESModules": true,
        "version": "7.9.6"
      }
    ]
  ]
}

This is the main.js code I get transpiled in my dist folder

import _asyncToGenerator from "@babel/runtime/helpers/esm/asyncToGenerator";
import header from './components/header.js';
import user from './components/user.js';

var app = /*#__PURE__*/function () {
  var _ref = _asyncToGenerator(function* () {
    document.getElementById('header').innerHTML = header();
    document.getElementById('user').innerHTML = yield user();
  });

  return function app() {
    return _ref.apply(this, arguments);
  };
}(); // init app

app();

And I see the above code is not prepared to run in the browser straightaway. So I have to change the first line manually like this:

import _asyncToGenerator from './components/asyncToGenerator.js'

And of course I have to manually copy asyncToGenerator.js from node_modules to my corresponding project folder.

Is there a way to run Babel and get this esm file in my components folder automatically? Am I missing something in the way @babel/plugin-transform-runtime plugin is used?