当我使用 react css 模块时，如何设置插件/框架组件的样式？

Question

When I use react CSS modules I can't style any framework or plugins components because the classes are Eunice anyone has a way to fix it?

import React from 'react';
import classes from './HeadSlider.css';

// components
import Slider from "react-slick";

const HeadSlider = () => {

    return (
        <Slider {...settings}>
            <div className="slider-item">
                <p className={classes.HeadSlider}>
                    international Money transfer
                </p>
                <p className={classes.content}>
                    Lorem ipsum dolor
                    sit amet,consectetur adipiscing elit, sed do eiusmod tempor incididunt ut
                    labore et dolore magna aliqua.
                </p>
                <img src="images/head-slider.png" alt="" className="img"/>
                <a href="#" className="button">EXPLORE</a>
            </div>
        </Slider>
    );
}

export default HeadSlider;

Answer 1

you should rename your CSS file to HeadSlider.module.css. and for more detail you can visit this: https://create-react-app.dev/docs/adding-a-css-modules-stylesheet