Tech/Typescript3 Partial migration of javascript to typescript 다음 글은 Microsoft/TypeScript-React-Conversion-Guide의 예제를 기반으로 작성되었습니다. 본문의 코드는 다음 링크에 있습니다. 본 글은 Javascript에서 Typescript로의 부분적인 전환을 위한 TicTacToc을 예제로 한 가이드이다. 부분적인 전환이 아닌, 새로운 프로젝트를 시작하는 것이라면 다음 링크를 참고하자. 모든 프로젝트에서 Typescript를 채택하는 것은 2단계로 나눌 수 있다. 빌드 파이프라인에 TypeScript 컴파일러(tsc)를 추가 JavaScript 파일을 TypeScript 파일로 변환 프로젝트 전환 전에는 다음과 같은 폴더 구조를 가지고 있다. TicTacToe_JS / |---- css/ // css style sheets |--.. 2021. 10. 7. tsconfig.json을 설정해보자 Typescript는 동적 타입 언어인 Javascript를 타입이 있는 언어로 사용할 수 있게 해주는 언어이다. Typescript로 작성된 코드는 트랜스파일러(컴파일러)를 통해 Javascript로 변환된다. 아래 명령어로 컴파일을 한다. tsc index.ts 컴파일 과정에서 여러 옵션을 정할 수 있는데, 해당 옵션들을 작성하는 파일이 tsconfig.json 이다. Typescript에 가장 기본이 되는 tsconfig.json 파일을 설정해보자. 디렉토리에 tsconfig.json 파일이 있다면 해당 디렉토리가 Typescript 프로젝트의 루트가 된다. tsconfig.json 파일은 프로젝트를 컴파일하는 데 필요한 루트 파일과 컴파일러 옵션을 지정한다. 설치하기 npx tsc --init t.. 2021. 8. 19. Typescript basic template 만들기 1. package.json 생성하기 yarn init 2. webpack 모듈 설치 yarn add -D webpack webpack-cli webpack-dev-server html-webpack-plugin yarn add -D @babel/core @babel/preset-env babel-loader -D : devDependencies 로 설정하여 배포 서버에서는 해당 모듈들을 설치하지 않을 수 있다. webpack : 번들러 모듈 webpack-cli : webpack 명령어를 사용할 수 있게해주는 모듈 webpack-dev-server : 실시간으로 변경사항을 보여주는 live server html-webpack-plugin : template html 파일에 번들 파일을 자동으로 추가해주.. 2021. 8. 12. 이전 1 다음
