3.CSSの調整

NextJS

globals.css

styles/globals.cssというファイルをpages/_app.jsにインポートすることで、アプリケーション全体に適用されるスタイルを定義できます

pages/_app.jsではデフォルトで

import "@/styles/globals.css";

となっているはずです

逆にindex.jsなどで

import "../styles/globals.css";

としてしまうと「Global CSS cannot be imported from files other than your Custom <App>」というエラーが発生します

Home.module.css

これはimportしたファイルにだけ読み込まれるCSSファイルです

import styles from "@/styles/Home.module.css";

<div className={style.wrap}>

className={styles.xxx}とします

BACK