본문 바로가기

TypeScript

2개의 interface 중, 어떤 interface인지 모를 때 interface User { name: string; age: number; occupation: string; } interface Admin { name: string; age: number; role: string; } export type Person = User | Admin; export const persons: Person[] = [ { name: 'Max Mustermann', age: 25, occupation: 'Chimney sweep' }, { name: 'Jane Doe', age: 32, role: 'Administrator' }, { name: 'Kate Müller', age: 23, occupation: 'Astronaut' }, { name: 'Bruce Willis'.. 더보기
Implement multiple styles into the inner style prop Inner style prop에 다중 스타일 적용 하기 Example 1) Style object 에 특정 조건에 따라 스타일을 적용 시킬 경우. style={ tempVaraiable ? {backGround: 'red'} : {background: 'blue'} } Example 2) Style object 에 특정 조건에 따라 다중 스타일을 적용 시킬 경우 style={Object.assign( { cursor: currentCellData.onClick ? 'pointer' : 'inherit' }, currentCellData.style && currentCellData.style )} - 2개의 스타일 object 를 Object.assign() 을 통해 통합 하고 style prop 으로 전달 더보기
Typescript transpile CSS, etc.. Transpile - 'tsc' 명령어를 통한 트랜스파일 ( JS로 변환) 은 TS, TSX 파일만 가능 하다. 하지만 이번에 맡은 Task에서, 특정 transpile 된 ts, tsx과 함께 CSS 또한 import 될 필요가 있었다. - 직접 적으로 해당 CSS 파일을 transpile 된 ts, tsx과 함께 같은 directory (폴더)에 넣어 주면 되지만, 매번 이러한 방법은 불편하기 때문에 'tsc'라는 명령어와 함께 CSS 파일 또한 transpile 된 파일들과 묶어지는 방법을 찾아봤다. 1. 두 가지 node module package를 설치해준다 a. npm install --save-dev rimraf b. npm install --save-dev copyfiles 2. 특정 스크.. 더보기