Javascript 获取'；无法解决导入和导入"；slickcarouselslickslicktheme.css"；'；错误

我用的是VITE的react-slick号 carousel .当我导入此处显示的css文件时，我收到一个错误:

Failed to resolve import "slick-carousel/slick/slick.css" and import "slick-carousel/slick/slick-theme.css";
import "slick-carousel/slick/slick.css";
import "slick-carousel/slick/slick-theme.css";

这是我的代码:

import React, { Component } from "react";
import Slider from "react-slick";
import Images from "../../../../assets/images/Images";

import "slick-carousel/slick/slick.css";
import "slick-carousel/slick/slick-theme.css";

// IMAGES DATA FOR CAROUSEL
interface Data {
  imgSrc: string;
}

const data: Data[] = [
  {
    imgSrc: Images.Airbnb,
  },
  {
    imgSrc: Images.Fedex,
  },
  {
    imgSrc: Images.Google,
  },
  {
    imgSrc: Images.Hubspot,
  },
  {
    imgSrc: Images.Microsoft,
  },
  {
    imgSrc: Images.Walmart,
  },
  {
    imgSrc: Images.Airbnb,
  },
  {
    imgSrc: Images.Fedex,
  },
];

// CAROUSEL SETTINGS
export default class CompanyCarasouls extends Component {
  render() {
    const settings = {
      dots: false,
      infinite: true,
      slidesToShow: 4,
      slidesToScroll: 1,
      arrows: false,
      autoplay: true,
      speed: 2000,
      autoplaySpeed: 2000,
      cssEase: "linear",
      responsive: [
        {
          breakpoint: 1024,
          settings: {
            slidesToShow: 4,
            slidesToScroll: 1,
            infinite: true,
            dots: false,
          },
        },
        {
          breakpoint: 700,
          settings: {
            slidesToShow: 2,
            slidesToScroll: 1,
            infinite: true,
            dots: false,
          },
        },
        {
          breakpoint: 500,
          settings: {
            slidesToShow: 1,
            slidesToScroll: 1,
            infinite: true,
            dots: false,
          },
        },
      ],
    };

    return (
      <div
        style={{ textAlign: "center", marginTop: "20px", marginBottom: "20px" }}
      >
        <div
          className="mx-auto max-w-4xl px-4 sm:px-6 lg:max-w-7xl lg:px-8"
          style={{ margin: "auto", width: "100%" }}
        >
          <h2 className="text-midnightblue text-2xl font-semibold">
            Trusted by companies of all sizes
          </h2>
          <div className="py-14">
            <Slider {...settings}>
              {data.map((item, i) => (
                <div key={i}>
                  <img
                    src={item.imgSrc}
                    alt={item.imgSrc}
                    width={116}
                    height={36}
                  />
                </div>
              ))}
            </Slider>
          </div>
          <hr />
        </div>
      </div>
    );
  }
}