@NarkoMan01

Как сделать динамический импорт React?

Добрый день!
Пытаюсь сделать динамический импорт в React.
/*
Переменная откуда я беру путь до компонента
*/
const steps = [
    {
        name: 'Шаг 1',
        component: './steps/step1.jsx'
    },
    {
        name: 'Шаг 2',
        component: './steps/step2.jsx'
    }
]

/*
Динамический импорт 
*/
 const Step =  React.lazy(()=> import(steps[0].component))

<React.Suspense fallback={<div>Loading...</div>}>
                <Step/>
            </React.Suspense>

То получаю ошибку о том что модуль не найдет.
Если же вставить строку то все работает
/*
При таком варианте все работает
*/
 const Step =  React.lazy(()=> import('./steps/step1.jsx'))


Подскажите пожалуйста в чем причина?
  • Вопрос задан
  • 75 просмотров
Решения вопроса 1
Seasle
@Seasle Куратор тега JavaScript
\( ゚ヮ゚)/
Сразу в component записывайте React.lazy.
Ответ написан
Пригласить эксперта
Ваш ответ на вопрос

Войдите, чтобы написать ответ

Войти через центр авторизации
Похожие вопросы