React 中的样式引入：内联样式、CSS 文件和 CSS 模块化

在 React 中引入样式有多种方式，下面是其中几种常见的方式：

1. 使用内联样式：可以直接在组件中使用 JavaScript 对象来定义样式，然后将样式对象作为组件的属性传递给元素。例如：

const style = {
  color: 'red',
  fontSize: '20px',
};

function MyComponent() {
  return <div style={style}>Hello World</div>;
}

2. 使用 CSS 文件：可以将样式定义在一个 CSS 文件中，然后在组件中使用 import 语句引入该 CSS 文件。例如：

import './styles.css';

function MyComponent() {
  return <div className='my-class'>Hello World</div>;
}

3. 使用 CSS 模块化：可以在 CSS 文件中使用模块化的方式定义样式，然后在组件中使用 import 语句引入样式，并通过类名的方式应用样式。例如：

import styles from './styles.module.css';

function MyComponent() {
  return <div className={styles.myClass}>Hello World</div>;
}

以上是几种常见的引入样式的方式，根据具体的需求和项目的配置，可以选择适合的方式来引入样式。