im having this error when doing a named import from framer-motion module in reactjs. Obs: im not using webpack.

import { Fragment } from "react";

import classes from "./Hero.module.css";

import { motion } from "framer-motion";

import Header from "../header/Header";

export default function Hero() {
  return (
    <Fragment>
      <Header />
      <section className={classes.banner}>
        <img src="https://i.imgur.com/1arVXy2.jpg" />
        <motion.h1 className={classes.slogan}>Produtos de alta performance</motion.h1>
        <div className={classes['see-more']}>
          <span>Veja mais</span>
        </div>
      </section>
    </Fragment>
  );
}