globalstyles (2) 썸네일형 리스트형 [Next.js] globalsStyle, customApp next.js에서 globalsStyle을 적용하려면 appComponent를 custom해줘야 한다. 기본적으로 숨어져있는 app을 수정하려면 1. pages에 _app.js를 만들어야한다. 2. _app.js에서 App component를 생성하고, Component와 pageProps를 parameter로 받은 후 불러와준다. export default function App({ Component, pageProps }) { return ( ); } 3. 그 후 styles폴더안의 globals.css 를 불러온다. (module이 아닌 css는 커스텀app에서만 불러올 수 있음) import "../styles/globals.css"; export default function App({ Comp.. React GlobalStyle Font 적용하기 제일 먼저 사용할 폰트를 다운받았습니다. 폰트 사용을 위해 index.css에 폰트를 등록해줍니다. 제일 중요한 점은 otf 파일은 format에 'opentype'을 지정해 줘야 합니다. 왜인지 format('otp')를 먹지를 않습니다. 글로벌스타일을 사용하기위해 atoms에 GlobalStyle을 만들어주고, App에 적용해줬습니다. 다음과 같이 적용이 잘 된것을 확인 할 수 있었습니다. 이전 1 다음