[Nextjs] Style

Global CSS

pages/_app.css

a {
    color: green;
}
csscopy

pages/_app.js

import './_app.css';

function App({ Component, pageProps }) {
    return <Component {...pageProps} />
}

export default App;
javascriptcopy

CSS Modules

components/Button.module.css

.button {
    background: grey;
}
csscopy

components/Button.js

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

const Button = ({children}) => {
    return <button className={styles.button}>{children}</button>
};

export default Button;
javascriptcopy

pages/index.js

import Button from "../components/Button";

<Button>Click Me</Button>
javascriptcopy