How to load remote file in webpack - asynchronous

Question

the remote file is a single components compiled by webpack
the wenpack config as follow:
{
.....
library: library
,externals: externals
,libraryTarget: "umd"
.....
}
the components is in the cdn,
i want to load and use the remote components in react.
and how to use it like the Pseudo code :
ajax -> get a json > { components name } > use the name to load romote file
for example the json have the botton i need to load the botton.min.js
var Button = reuqire('http://botton.min.js')
class App extends React.Component {
render() {
return (
<div>
<Botton/>
</div>
);
}
}
export default App;

Answer 1

npm install scriptjs
var $script = require("scriptjs");
$script("//ajax.googleapis.com/ajax/libs/jquery/2.0.0/jquery.min.js", function() {
$('body').html('It works!')
});

Answer 2

As I said in the other post: I have looked around for a solution and most of all proposals were based on externals, which is not valid in my case.
More info here: https://stackoverflow.com/a/62603539/8650621
Basically, I finished using a separate JS file which is responsible for downloading the desired file into a local directory. Then WebPack scans this directory and bundles the downloaded files together with the application.

Answer 3

Maybe you can find solutions on the following resoures:
https://stackoverflow.com/a/33293033/1204375
how to use webpack to load CDN or external vendor javascript lib in js file, not in html file
Webpack and external libraries
How to use a library from a CDN in a Webpack project in production
https://github.com/webpack/webpack/issues/150
https://github.com/webpack/webpack/issues/240