Differences

This shows you the differences between two versions of the page.

--- public:computer:typescript [2021/12/23 10:51] – alex
+++ public:computer:typescript [2023/01/03 10:59] – alex
@@ Line 1: / Line 1: @@
 ====== TypeScript ======
+===== Quick Start =====
+  * typescript 설치 <sxh bash>
+$ npm i -g typescript  # install globally, use $ tsc <typescript file>
+# or
+$ npm i -D typescript  # install devDependency, use $ npx tsc <typescript file>
+$ npm ls -g --depth=0  # 확인
+$ tsc -v  # global
+$ npx tsc -v  # local
+</sxh>
+  * prettier <sxh bash>
+$ npm i tslint-config-prettier
+</sxh>
+  * set tslint.json <sxh json>
+{
+  "defaultSeverity": "error",
+  "extends": ["tslint:latest", "tslint-config-prettier"],
+  "jsRules": {},
+  "rules": {
+    "semicolon": true
+  },
+  "rulesDirectory": []
+}
+</sxh>
+  * generate tsconfig.json <sxh json>
+$ tsc --init
+</sxh>
+  * edit package.json for prettier <sxh json>
+  "prettier": {
+    "printWidth": 80,
+    "useTabs": false,
+    "tabWidth": 2,
+    "bracketSpacing": true,
+    "semi": true,
+    "singleQuote": false
+  }
+}
+</sxh>
+  * install ts-node <sxh bash>
+$ npm install -g ts-node  # global
+$ npm install --save-dev ts-node  # local
+</sxh>
+  * 프로젝트 시작하기 <cli prompt="$" comment="  # ">
+$ npm init -y  # create package.json in node.js project
+$ npm install typescript --save-dev  # add typescript
+$ npm install @types/node --save-dev  # add node.d.ts
+$ npx tsc --init --rootDir src --outDir lib --esModuleInterop --resolveJsonModule --lib es6,dom --module commonjs  # initialize typescript with tsconfig.json
+$ npm install ts-node --save-dev  # to support realtime compile using ts-node
+$ npm install nodemon --save-dev  # monitoring file change using nodemon
+</cli>
+  * package.json <code json>
+"scripts": {
+  "start": "npm run build:live",
+  "build": "tsc -p .",
+  "build:live": "nodemon --watch 'src/**/*.ts' --exec \"ts-node\" src/index.ts"
+},
+</code>
+  * 실행 <cli prompt="$" comment="  # ">
+$ npm start
+</cli>
+  * [[https://offbyone.tistory.com/445|Node.js + TypeScript 프로젝트 만들기]]
+  * [[https://velog.io/@grinding_hannah/TypeScript-nodemon-ts-node-%EB%AA%A8%EB%93%88-%EC%84%A4%EC%B9%98%ED%95%98%EA%B8%B0|[TypeScript] nodemon, ts-node 모듈 설치하기]]
+  * [[https://radlohead.gitbook.io/typescript-deep-dive/nodejs|Node.js 시작하기]]
 ===== Setup =====