Javascript 是否可以从url在React中延迟加载一组组件/模块？

我正在构建一个React应用程序，它将支持第三方开发人员编写他们自己的组件，我们将对这些组件进行测试，然后将其托管在我们公司的CDN上。我使用

@loadable/component

动态加载模块，但我不知道如何让它在某个网址上运行

以下是我到目前为止关于延迟加载组件的内容。要提取的组件在.json文件中列出。这个.json文件被解析，我编写的组件在该位置获取index.js并将该组件加载到应用程序中

import moduleMetaData from "../thirdparty_modules"; //the json file outlining which modules to load
import loadable from "@loadable/component";
import React from "react";

const Module = (props) => {
    let id = props.id;
    let LoadedModule = null;

    if (!!moduleMetaData[id]) {
        let moduleLocation = moduleMetaData[id].location;

        LoadedModule = loadable(() => import(`${moduleLocation}`), {
            fallback: <div>Loading Module...</div>
        });
    }    
    return <LoadedModule/>;
}

export default Module;

然后，我使用App.js中的

组件将模块加载到我的应用程序中：

const App = () => {
    const GetModules = () => {
        let loadedModules = [];
        for(let key in moduleMetaData){
            loadedModules.push(<Module key={key} id={key}/>);
        }

        return loadedModules;
    }

    return (
        <AppContext.Provider
            value={{
                routes
            }}
        >
            <StylesProvider jss={jss} generateClassName={generateClassName}>
                <Provider store={store}>
                    <MuiPickersUtilsProvider utils={MomentUtils}>
                        <Auth>
                            <Router history={history}>
                                <FuseAuthorization>
                                    <FuseTheme>
                                        <FuseLayout/>
                                    </FuseTheme>
                                </FuseAuthorization>
                            </Router>
                        </Auth>
                    </MuiPickersUtilsProvider>

                    {/*LOAD MODULES*/}
                    {GetModules()}
                </Provider>
            </StylesProvider>
        </AppContext.Provider>
    );
};

export default App;

const-App=（）=>{
常量GetModules=（）=>{
设loadedModules=[]；
for（输入moduleMetaData）{
loadedModules.push（）；
}
返回加载模块；
}
返回(
"

如何让我的组件延迟加载从外部url加载，而不必从本地
/src
目录加载？
虽然不能将其与
import
一起使用，但仍然可以使用例如Fetch API检索数据并返回它

差不多

        LoadedModule = loadable(() => fetch(moduleLocation).then(res => res.text())

应该可以正常工作。
您的url不正确。它说
找不到模块
/它是正确的，即使我使用本地路径，我也会得到相同的
找不到模块
错误。对于任何不在我的/src目录内的路径，我都会得到该错误。您是否使用react中的
lazy
进行了尝试，或者看到
Tyler McGinnis
导师我来解释一下。让我吃早餐。不过我需要获取的url是一个javascript文件，而不是json。加载一个.js文件并将js文件中概述的组件加载到我的应用程序中需要这样做吗？对不起，愚蠢的习惯-应该是
res.text（）
当然要将响应读入字符串…要更改答案。
        LoadedModule = loadable(() => fetch(moduleLocation).then(res => res.text())