Ошибка «Тип элемента недействителен», когда компонент находится внутри папки src, но работает при размещении в node_moduJavascript

Форум по Javascript
Ответить
Anonymous
 Ошибка «Тип элемента недействителен», когда компонент находится внутри папки src, но работает при размещении в node_modu

Сообщение Anonymous »

Я установил необходимые пакеты:

Код: Выделить всё

npm install react-slick slick-carousel
Но я получаю эту ошибку при попытке использовать реакцию-slick:

Код: Выделить всё

Element type is invalid: expected a string (for built-in components) or a class/function (for composite components) but got: object
Странная часть:
Если я копирую свой компонент в node_modules/react-slider/, слайдер работает

Если тот же компонент находится в моей папке src/, я получаю указанную выше ошибку
Вот код моего компонента:

Код: Выделить всё

import React from "react";
import Slider from "react-slick";
import "slick-carousel/slick/slick.css";
import "slick-carousel/slick/slick-theme.css";

function Page67() {
const items = [
{ id: 1, image: "https://picsum.photos/300?random=1", name: "Mountain View", subtitle: "A peaceful nature scene" },
{ id: 2, image: "https://picsum.photos/300?random=2", name: "City Lights", subtitle: "Nightlife in a modern city" },
{ id: 3, image: "https://picsum.photos/300?random=3", name: "Sunny Beach", subtitle: "Relaxing tropical vibes" },
{ id: 4, image: "https://picsum.photos/300?random=4", name: "Forest Road", subtitle: "A calm walk through nature" },
{ id: 5, image: "https://picsum.photos/300?random=5", name: "Snowy Peaks", subtitle: "Majestic winter mountains" }
];

const settings = {
dots: true,
infinite: true,
speed: 500,
slidesToShow: 3,
slidesToScroll: 1
};

return (


{items.map((i) => (


[img]{i.image} alt={i.name} className=[/img]
{i.name}
{i.subtitle}


))}


);
}

export default Page67;

Код: Выделить всё

console.log(Slider)
печатает:

Код: Выделить всё

{ __esModule: true, default: ƒ Slider() }
Итак, модуль импортируется, но React по-прежнему выдает ошибку «недопустимый тип».
Почему React-slick работает только тогда, когда файл перемещается в node_modules, но не когда он помещается внутри src?

Связано ли это с объединением, разрешением модуля или модулями ES?
Любая помощь приветствуется.



Подробнее здесь: https://stackoverflow.com/questions/798 ... ut-works-w
Ответить

Быстрый ответ

Изменение регистра текста: 
Смайлики
:) :( :oops: :roll: :wink: :muza: :clever: :sorry: :angel: :read: *x)
Ещё смайлики…
   
К этому ответу прикреплено по крайней мере одно вложение.

Если вы не хотите добавлять вложения, оставьте поля пустыми.

Максимально разрешённый размер вложения: 15 МБ.

Вернуться в «Javascript»