절대경로 설정하기
1. root 경로에 jsconfig.json 파일 생성
// jsconfig.json
{
"compilerOptions": {
"baseUrl": "src"
},
"include": [
"src"
]
}
2. vscode 재시작
3. baseUrl을 기준으로 작성하면 됨
ex 1) src/assets/melting_chiikawa 이미지 import 하기
import meltingChiikawa from "assets/melting_chiikawa.png"
ex 2) src/components/Main/LetterSummaryView 컴포넌트 import 하기
import LetterSummaryView from "components/Main/LetterSummaryView";
children props로 공통레이아웃 사용하기
function Layout({ children }) {
return (
<div>
<Header></Header>
{children}
</div>
)
}
function Home() {
return <Layout >
{/* 감싸진 내용이 Layout의 children props로 들어간다. */}
<LetterSendingBox></LetterSendingBox>
<LetterBoxSelector></LetterBoxSelector>
<LetterSummaryView></LetterSummaryView>
<EmptyLetterBoxMessage></EmptyLetterBoxMessage>
</Layout>
}
React 프로젝트에 reset.css 적용하기
1. reset style 컴포넌트 생성
2. import { createGlobalStyle } from "styled-components";
3. reset css 컴포넌트로 작성 후 export
4. 컴포넌트 최상위에 <ResetCompoent /> 작성
주의. reset css 컴포넌트는 children을 가질 수 없다.
'Today I Learned' 카테고리의 다른 글
2024.01.31 TIL (0) | 2024.01.31 |
---|---|
2024.01.30 TIL (0) | 2024.01.30 |
2024.01.26 TIL (0) | 2024.01.26 |
2024.01.25 TIL (1) | 2024.01.25 |
2024.01.24 TIL (1) | 2024.01.24 |