Компонент отложенной загрузки выдает ошибку, если путь к компоненту задан из конфигурации js

У меня есть приложение с реактивным маршрутизатором, и я пытаюсь отложить загрузку компонентов следующим образом.

import { RouteInterface } from "./src/models";
import * as getConfig from "./config";
import React, { lazy } from "react";

export const EXTENSION_ROUTES = (): RouteInterface[]  => {
    const routeList = getConfig()?.routes;
    
    let DynamicLoader;
    DynamicLoader = lazy(() => import("./components/application-logs/app-log-listing"));

    routeList[0].component = DynamicLoader

    return routeList;
}

Теперь этот метод работает нормально, и компонент загружается. Когда я передаю путь, используя конфигурацию, которую я используюgetConfig, как в следующем коде,

DynamicLoader = lazy(() => import(`${routes[0].component}`))

Я получаю следующую ошибку.

Мой файл конфигурации выглядит следующим образом.

module.exports = () => {
    return {
        sections: {
            components: {
                "example": "./components/example.tsx"
            }
        },
        routes: [
            {
                component: "./components/application-logs/app-log-listing",
                exact: true,
                icon: "connections",
                id: "AppLog",
                name: "Application Logs",
                path: "/application-logs",
                protected: true,
                showOnSidePanel: true
            },
        ]
    };
};

Остальные файлы находятся в tsx формат и файл конфигурации находится в js. Почему эта ошибка возникает только потому, что я использую конфиг?

0 ответов

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