CSS モジュール

このドキュメントは、従来の Remix コンパイラ を使用する場合にのみ関連しています。Remix Vite を使用している場合は、CSS モジュールは Vite に組み込まれています

組み込みの CSS モジュールサポートを使用するには、最初にアプリケーションに CSS バンドル を設定していることを確認してください。

その後、.module.css ファイル名の規則を使用して CSS モジュール をオプトインできます。例:

app/components/button/styles.module.css
.root {
  border: solid 1px;
  background: white;
  color: #454545;
}
app/components/button/index.js
import styles from "./styles.module.css";
 
export const Button = React.forwardRef(
  ({ children, ...props }, ref) => {
    return (
      <button
        {...props}
        ref={ref}
        className={styles.root}
      />
    );
  }
);
Button.displayName = "Button";