Remix ドキュメント 日本語版

English

CSS Modules

このドキュメントは、Classic Remix Compiler を使用している場合にのみ関連します。Remix Vite を使用している場合は、CSS Modules のサポートが Vite に組み込まれています。

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

次に、.module.css ファイル名の規約を使用して CSS Modules を選択できます。例：

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";