노드의 TypeScript 설정에 대한 기본 지식입니다.VS 코드가 있는 js

TypeScript는 정적 유형 및 유형 추정 옵션을 제공하는 JavaScript 의 초집합입니다.또한 Babel 프로젝트와 유사하게 현대적인 JavaScript 기능도 지원합니다.

There is a complementary, on YouTube for this article where I show this TypeScript setup.


TypeScript를 사용하면 JavaScript를 더욱 재미있게 사용할 수 있습니다.TypeScript를 사용하는 가장 큰 장점 중 하나는 the IntelliSense feature입니다. 상하문 코드 완성, 정지 정보와 방법 서명 정보를 포함하는 풍부한 개발 환경을 제공합니다.

또한 TypeScript는 우수한 소프트웨어를 작성하는 데 필요한 조건이 아닙니다.대부분의 타자에 관한 문장은 언어를 필요로 한다.이거 진짜 아니야.소프트웨어에서 대부분의 문제는 규범 오류와 구조 오류에서 나온다.
유형은 낮은 등급과 미시적인 등급에서 인코딩 체험을 개선했다.그것들은 더욱 엄격하고 안전한 인코딩 환경을 제공함으로써 특정한 코드 줄을 작성하는 데 큰 도움을 준다.
실제적인 이점은 가늠하기 어렵지만 TypeScript를 사용하면 소프트웨어 실천을 현저하게 바꿀 수 없습니다.심지어 타입을 사용해서는 안 된다는 뚜렷한 목소리도 있다.

I think this is exactly backwards, types often cripple larger codebases. #Clojure https://t.co/2eJIQsmRrR
— stuarthalloway (@stuarthalloway) September 27, 2019


개인적으로 나는 TypeScript를 사용하는 것을 매우 좋아한다. 심지어는 일반적인 자바스크립트를 더 이상 작성하고 싶지 않다.

가장 간단한 TypeScript 세션


가장 간단한 TypeScript 코드 세그먼트부터 시작합시다. 그것도 익숙하지 않습니다.다시 말하면 그것은 문법이 정확한 코드로 흔히 볼 수 있는 인코딩 실천을 따르지 않는다.
let message: string = "Hello World"
TypeScript를 사용하면 message 변수의 유형을 string 로 지정할 수 있습니다.이 유형의 주석은 특정 변수(또는 상수)가 받아들일 수 있는 값 범위나 특정 함수가 되돌릴 수 있는 값 범위를 설명합니다.TypeScript를 사용하면 코드에서 값 구속을 명시적으로 지정할 수 있습니다.이것은 더욱 엄격한 통제를 초래할 것이다. 이것은 좋은 일이다.
그러나 유형은 코드의 유연성을 떨어뜨렸다.이것이 바로 정태와 동태 유형의 논쟁에서 공감대를 형성하지 못한 이유 중의 하나이다.결국 이것은 개인의 선호와 경험으로 귀결된다.

유형 추정


그럼 이 단락은 뭐가 틀렸을까?TypeScript는 일반적으로 사용되지 않습니다. TypeScript는 유형을 지정할 수 있을 뿐만 아니라 코드의 특정 변수나 함수의 사용 방식에 따라 유형을 추측할 수 있을 정도로 똑똑하기 때문입니다type inference.
TypeScript 컴파일러는 우리의 코드를 보고 변수, 상수 또는 함수의 값 범위를 추정합니다.유형 추정은 가능한 한 많이 사용해야 한다.일반적으로 컴파일러는 당신보다 어떤 유형을 사용해야 하는지 더 잘 알고 있습니다.따라서 일반적인 TypeScript에서는 위의 코드를 다음과 같이 작성해야 합니다.
let message = "Hello World"
흥미로운 것은 그것이 일반적인 JavaScript처럼 보인다는 것이다.일반적으로 TypeScript 컴파일러는 이러한 유형을 쉽게 추정할 수 있기 때문에 할당된 값에 유형을 지정하지 않아야 합니다.다른 한편, 함수 매개 변수에 형식을 현저하게 제공해야 합니다.

TypeScript의 HTTP 서버


이제 Node에서 간단한 HTTP 서버를 작성합니다.js는 TypeScript를 사용하여 기존 TypeScript를 지원하는 VS 코드를 봅니다.VS 코드가 실제로 TypeScript로 작성된 것을 알 수 있지만, 편집기는 자동 형식 가져오기라고 불리는 기능을 제공합니다.
Automatic Types Aquisition VS Code를 사용하여 코드에 사용되는 패키지의 유형 정의를 자동으로 다운로드합니다.따라서 TypeScript를 더욱 편리하고 엄격하게 사용할 수 있습니다.
TypeScript 항목을 초기화합니다.
mkdir typescript-with-zaiste
cd typescript-with-zaiste
npm init --yes
npm install -D typescript
tsc init
~ 응용 프로그램에 저장된 다음 코드 세그먼트를 고려해 봅시다.ts~파일:
import http, { IncomingMessage, ServerResponse } from 'http';

const handler = (request: IncomingMessage, response: ServerResponse) => {
  response.end('Hello, World');
}

http
  .createServer(handler)
  .listen(8080, () => console.log('started'));
VS 코드에서 자동 형식 가져오기를 기본적으로 사용합니다. 간단하게 입력할 수 있습니다.(점) 변수 다음에 해당 객체의 모든 가능한 필드와 방법 및 문서를 봅니다.
이러한 유형의 정의로 인해 이것은 가능하다.http 모듈의 문서 사이를 왔다갔다할 필요가 없습니다.모든 것이 한 곳에 있어서 인코딩을 간소화했다.

일반 JavaScript의 유형

response는 노드의 핵심 모듈이다.js와 노드.js는 TypeScript로 작성된 것이 아닙니다.따라서 유형에 대한 정보는 없습니다.많은 유행하는 NPM 패키지는 여전히 JavaScript를 사용하여 작성됩니다.
이러한 상황에서 유형 정보를 제공하기 위해 DefinitelyTyped라는 특수 프로젝트가 있다.VS 코드의 자동 형식 가져오기 기능은 이 항목에서 형식 정보를 가져옵니다.우리의 예시에서 우리는 http 노드에서 @types/node 모듈의 이 정보를 얻는데 의존한다.js.httpdevDependencies 를 사용하여 이러한 유형을 프로젝트에 현저하게 포함하는 것은 좋은 방법이다.VS 코드 이외의 편집기를 사용하는 사용자도 유형 정의에서 혜택을 볼 수 있습니다.
npm install -D @types/node
Node를 사용하여 실행하기 전에 먼저 TypeScript 항목을 JavaScript로 컴파일하거나 전송해야 합니다.js.이 투명 프로세스는 package.json 패키지에 첨부된 tsc 명령행 도구를 사용하여 완성되었습니다.
npm install -D typescript
보다 간소화된 프로세스를 위해 TypeScript 컴파일러가 typescript 옵션을 사용하여 파일을 계속 모니터링하고 변경될 때 자동으로 다시 컴파일하도록 지시할 수 있습니다.

VS 코드가 있는 TypeScript


VS 코드는 --watch의 존재를 통해 TypeScript 프로젝트를 식별하고 적절한 구축 작업을 편리하게 제공합니다.컴파일은 명령 팔레트를 사용하여 직접 트리거하고 편집기의 UI를 사용하여 원활하게 실행할 수 있습니다. 터미널과 편집기 사이를 전환할 필요가 없습니다.
전체 과정을 더욱 간소화하고 편집기 범위의 키 연결을 통해build 명령에 편리하게 설치할 수 있도록 VS 코드에 기본 구축 작업을 지정할 수 있습니다.
이 설정은 특정 작업을 수행하기 위해 실행되는 일반적인 명령행 응용 프로그램에 적용됩니다.일단 완성하면 그들은 완성할 것이다.노드에 있습니다.그러나 우리는 웹 서버를 구축했다. 이것은 장기적으로 실행되는 프로세스로 요청을 받아들이고 응답을 되돌릴 수 있다.TypeScript 응용 프로그램 설정에 문제가 발생할 수 있습니다.우리는 코드를 TypeScript에서 JavaScript로 전송해야 할 뿐만 아니라 노드를 다시 불러와야 한다.js 서버의 실례, 컴파일이 완료되면, 우리 파일의 모든 변경 사항입니다.
이 문제는 많은 해결 방안이 있다.파일이 바뀌면 nodemon을 사용하여 TypeScript 컴파일과 서버를 다시 시작할 수 있지만, 이것은 최선의 선택이 아닙니다. 특히 더 큰 프로젝트에 대해서는.우리는 tsconfig.json라는 도구를 사용할 수 있다. 이 도구는 약간 스마트하고 리셋 사이에서 TypeScript 컴파일을 공유할 수 있다.그러나 더 좋은 해결 방안이 있다.

PM2 개발 중인 재가동


자바스크립트 생태계는 매우 풍부하여 사람들로 하여금 어찌할 바를 모르게 하기 쉽다.나는 의존 관계를 최소한으로 유지하고 기존의 내용을 중용하는 것을 더 좋아한다.따라서pm2 도구, 즉 노드를 사용할 것입니다.실행 노드의 js 표준입니다.js 생산 과정.이 도구는pm2 dev 명령이라는 개발 모델도 제공합니다.다른 의존 항목을 추가하는 것이 아니라 그것을 사용합시다.
"scripts": {
  "dev": "pm2-dev app.js"
}
ts-node-dev를 통해 실행된 TypeScript 컴파일러 프로세스를 제외하고 VS 코드의tasks 기능을 사용하여 dev 스크립트를 직접 실행할 수 있습니다.지금부터 tsc --watch 의 모든 변경 사항은 TypeScript에서 자동으로 다시 컴파일하고 pm2 도구로 빠르게 다시 불러옵니다.


TypeScript는 JavaScript 작성을 더욱 재미있게 합니다.그것은 타자 오류의 확률을 줄였고, 타자 시스템은 오류 구역을 제한했다.
우리는 또한 개발 과정을 간소화하고 가속화하여 편집기와 단말기 사이를 전환하는 수요를 없앴다. - 현재 모든 것이 한 곳에 있고 VS 코드에서 직접 접근할 수 있다.
Node의 완벽한 TypeScript 설정입니다.js와 VS 코드, 정말!

좋은 웹페이지 즐겨찾기