import Head from 'next/head'
import Stories from 'stories-react';
import 'stories-react/dist/index.css';
import Lottie from "lottie-react";
const Slide = () => {
const animationURL = 'public/background-lottie-v3.json';
return (
<div>
<Lottie
animationData={animationURL}
/>
</div>
);
};
export default function Home() {
const stories = [
{
type: 'component',
component: Slide,
duration: 15000,
}
];
return (
<>
<Head>
<title>Create Next App</title>
<link rel="icon" href="/favicon.ico" />
</Head>
<Stories width="393.75px" height="700px" stories={stories} />
</>
)
}
I'm using nextjs for a project and when importing a lottie animation inside a component it gets set to undefined and breaks. here is my code
how can i solve this?