본문 바로가기
반응형

Front-End/TypeScript3

[TS] Typescript 에서 pipe 연산자 구현하기 pipe 함수를 왜 사용해야 하는가 만약 다음과 같은 코드를 작성한다고 해봅시다. const n = -19; const result = Math.floor(Math.sqrt(Math.abs(n)))); 작성하는 사람도, 보는 사람도 알기 어려운 코드입니다. 이를 pipe 함수를 사용해서 나타내면 다음과 같습니다. const n = -19; const result = pipe(n, Math.abs, Math.sqrt, Math.floor); 이처럼 pipe 함수를 사용하면 코드의 흐름을 분명하게 할 수 있습니다. Javascript 에서 pipe 함수 function pipe(arg, firstFn, ...fns) { return fns.reduce((acc, fn) => fn(acc), firstFn(a.. 2023. 7. 25.
[TS] jest (vite, typescript) 설정하기 cra 를 사용하면 설정 없이 바로 사용할 수 있지만, 그렇지 않은 경우 jest 를 사용하기 위해서는 여러 설정이 필요합니다. 사용 기술 : yarn, typescript, vite 1. 라이브러리 import 하기 yarn add -D jest, @types/jest, jest-environment-jsdom, ts-jest 2. jest.config.json 설정 { "roots": ["/"], "testEnvironment": "jsdom", "moduleNameMapper": { "\\.(css|less|svg)$": "identity-obj-proxy" }, "transform": { "^.+\\.tsx?$": "ts-jest" } } 3. babel.config.json 설정 { "prese.. 2023. 3. 14.
[TS] Vite + TS 절대경로 설정하기 [문제 상황] 처음 vite 를 시작하고, typescript 로 설정을 하면 상대경로만 지정을 할 수 있다. 설정을 추가해서 절대경로를 사용하는 방법을 알아보자. [해결 방법] 절대경로를 설정하기 위해서는 2개의 파일을 건드려야 한다. 1. vite.config.ts vite 에게 경로에 대한 정보를 알려주어야 컴파일을 정상적으로 할 수 있다. 먼저 나의 파일 구조는 다음과 같다. index.html vite.config.ts tsconfig.json public └─ vite.svg src ├─ model │ ├─ ... │ └─ ... ├─ pages │ ├─ ... │ └─ ... └─ main.ts 이때 public, src, model, pages 에 절대경로로 바로 접근할 수 있도록 한다. .. 2023. 3. 8.
반응형

티스토리툴바