본문 바로가기

반응형

typescript

(3)
프론트엔드 webpack + typescript 설정 오늘은 간단하게 프론트엔드에서 webpack + typescript를 설정하는 간단한 방법을 살펴보기로 합시다. 프론트엔드에서 typescript는 디버깅 측면에서 정말 중요한 부분인데 단순히 자바스크립트를 사용할 경우에 변수의 타입을 확인할 방법이 없기 때문에 undefined와 같은 값이 나타나게 됩니다. 따라서 최근에는 typescript를 무조건 써야하는 경우가 발생하고, 이는 유지보수측면에서도 상당한 이점을 가져옵니다. 이러한 typescript를 설정하기 위해서는 먼저 아래의 패키지를 설치합니다. npm install --save-dev typescript ts-loader tsconfig.json이라는 파일이 반드시 필요합니다. tsconfig.json은 타입스크립트가 파일을 읽을 때 어떻게..
타입스크립트(TypeScript) 객체와 타입 오늘은 타입스크립트(TypeScript)의 객체와 타입에 대해서 살펴보겠습니다. * 타입 주석 - 타입스크립트는 자바스크립트 변수 선언문을 확장해 다음과 같은 형태로 타입을 명시할 수 있습니다. let 변수 이름: 타입 [= 초깃값] const 변수 이름: 타입 = 초깃값 let n: number = 1; let b: boolean = true; // 혹은 false let s: string = 'hello'; let o: object = {}; * 타입 추론 - 타입스크립트는 자바스크립트와 호환성을 위해 타입 주석 부분을 생략할 수 있습니다. - 타입스크립트 컴파일러는 다음과 같은 코드를 만나면 대입 연산자 = 오른쪽 값에 따라 변수의 타입을 지정합니다. let n = 1; // n의 타입을 numbe..
타입스크립트 프로젝트 만들기 타입스크립트를 만들기 전에 노드제이에스 프로젝트는 디렉터리를 하나 만들고 package.json이란 이름의 파일을 만드는 것으로 시작합니다. npm init 명령을 실행해서 생성합니다. package.json은 노드제이에스가 관리하는 패키지 관리 파일로서 프로젝트 정보와 관련 패키지가 기록됩니다. { "name": "ch02-1", "version": "1.0.0", "description": "", "main": "index.js", "scripts": { "test": "echo \"Error: no test specified\" && exit 1" }, "keywords": [], "author": "", "license": "ISC" } - 프로젝트 구현에 필요한 다양한 오픈소스 패키지를 npm ..