在 React 中，你可以使用 CSS 模块来实现每个页面使用独立的 CSS 文件。CSS 模块是一种将 CSS 样式封装在模块中的方式，可以避免样式冲突和全局污染。

以下是使用 CSS 模块实现每个页面使用独立 CSS 文件的步骤：

  1. 创建 CSS 文件：为每个页面创建一个独立的 CSS 文件，例如 Page1.css、Page2.css 和 Page3.css。
  2. 导入 CSS 文件：在每个页面的组件文件中，使用 import 语句导入相应的 CSS 文件。例如，在 Page1.js 文件中，可以这样导入 Page1.css：
import styles from './Page1.css';
  1. 使用 CSS 类：在组件的渲染函数中，可以使用导入的 CSS 类来设置组件的样式。例如，在 Page1.js 文件中，可以这样使用 styles 对象中的 CSS 类：
<div className={styles.container}>
  <!-- 页面内容 -->
</div>

通过使用 CSS 模块，每个页面的 CSS 样式都被封装在独立的模块中，不会影响其他页面的样式。这样可以确保每个页面都有自己独立的样式，并且可以方便地进行维护和管理。