수색…


통사론

  • import {component} from 'libName'; // Will import the class "component"
  • import {component as c} from 'libName'; // Will import the class "component" into a "c" object
  • import component from 'libname'; // Will import the default export from libName
  • import * as lib from 'libName'; // Will import everything from libName into a "lib" object
  • import lib = require('libName'); // Will import everything from libName into a "lib" object
  • const lib: any = require('libName'); // Will import everything from libName into a "lib" object
  • import 'libName'; // Will import libName module for its side effects only

비고

구문이

import * as lib from 'libName';

import lib = require('libName');

똑같은 것이지만 그렇지 않습니다!

TypeScript 관련 export = 구문을 사용하여 내 보낸 클래스 Person 을 가져 오려고한다고 가정 해 봅시다.

class Person {
...
}
export = Person;

이 경우 es6 구문을 사용하여 가져올 수 없으므로 (컴파일 할 때 오류가 발생 함) TypeScript 관련 import = 구문을 사용해야합니다.

import * as Person from 'Person';  //compile error
import Person = require('Person');  //OK

그 반대는 사실입니다. 고전 모듈은 두 번째 구문으로 가져올 수 있습니다. 따라서 마지막 구문은 모든 내보내기를 가져올 수 있기 때문에 더 강력합니다.

자세한 내용은 공식 문서를 참조하십시오.

npm에서 모듈 가져 오기

모듈에 대한 유형 정의 파일 (d.ts)이있는 경우 import 문을 사용할 수 있습니다.

import _ = require('lodash');

모듈에 대한 정의 파일이 없으면 가져 오려는 모듈을 찾을 수 없어 컴파일시 오류가 발생합니다.

이 경우 일반 런타임 require 기능을 사용하여 모듈을 가져올 수 있습니다. 그러나 이것은 any 유형으로 리턴합니다.

// The _ variable is of type any, so TypeScript will not perform any type checking.
const _: any = require('lodash');

TypeScript 2.0에서는 모듈에 대한 형식 정의 파일이 없을 때 모듈이 존재 함을 TypeScript에 알리기 위해 약식 모듈 선언 을 사용할 수도 있습니다. 이 경우 TypeScript는 의미있는 typechecking을 제공하지 못합니다.

declare module "lodash";

// you can now import from lodash in any way you wish:
import { flatten } from "lodash";
import * as _ from "lodash";

TypeScript 2.1부터 규칙은 더욱 완화되었습니다. 이제 node_modules 디렉토리에 모듈이 존재하는 한 TypeScript는 모듈 선언이없는 곳에서도 가져올 수 있습니다. ( --noImplicitAny 컴파일러 옵션을 사용하면 아래에 경고 메시지가 계속 표시됩니다.)

// Will work if `node_modules/someModule/index.js` exists, or if `node_modules/someModule/package.json` has a valid "main" entry point
import { foo } from "someModule";

정의 파일 찾기

typescript 2.x 용 :

DefinitelyTyped의 정의는 @types npm 패키지를 통해 사용할 수 있습니다.

npm i --save lodash
npm i --save-dev @types/lodash

하지만 다른 레포지스에서 사용 유형을 원한다면 이전 방법으로 사용할 수 있습니다.

typescript 1.x 용 :

Typings 은 유형 정의 파일을 로컬 프로젝트에 자동으로 설치할 수있는 npm 패키지입니다. 빠른 시작 을 읽는 것이 좋습니다.

npm install -global typings

이제 우리는 타이핑 cli에 액세스 할 수 있습니다.

  1. 첫 번째 단계는 프로젝트에서 사용하는 패키지를 검색하는 것입니다.

    typings search lodash
    NAME              SOURCE HOMEPAGE                                        DESCRIPTION VERSIONS UPDATED
    lodash            dt     http://lodash.com/                                          2        2016-07-20T00:13:09.000Z
    lodash            global                                                             1        2016-07-01T20:51:07.000Z
    lodash            npm    https://www.npmjs.com/package/lodash                        1        2016-07-01T20:51:07.000Z
    
  2. 그런 다음 설치할 소스를 결정하십시오. 나는 Community가 입력을 편집 할 수있는 GitHub Repo의 DefinitelyTyped 를 나타내는 dt를 사용합니다. 또한 일반적으로 가장 최근에 업데이트되었습니다.

  3. 입력 파일을 설치하십시오.

     typings install dt~lodash --global --save
    

마지막 명령을 분해합시다. lodash의 DefinitelyTyped 버전을 프로젝트의 전역 입력 파일로 설치하고이를 typings.json 종속성으로 저장합니다 typings.json . 이제 lodash를 가져올 때마다 typescript는 lodash 타이핑 파일을로드합니다.

  1. 개발 환경에서만 사용할 타이핑을 설치하려면 --save-dev 플래그를 제공 할 수 있습니다.

     typings install chai --save-dev
    

입력없이 전역 외부 라이브러리 사용

모듈이 이상적이지만 사용하는 라이브러리가 script 태그에 의해로드 되었기 때문에 전역 변수 ($ 또는 _ 등)에 의해 참조되는 경우이를 참조하기 위해 앰비언트 선언을 만들 수 있습니다.

declare const _: any;

typescript 2.x로 정의 파일 찾기

typescript의 2.x 버전에서는 입력을 npm @types 저장소 에서 사용할 수 있습니다. 이것들은 타이프 스크립트 (typcript) 컴파일러에 의해 자동으로 해결되며 훨씬 더 간단합니다.

유형 정의를 설치하려면 프로젝트 패키지에 dev 종속 항목으로 설치하십시오.

npm i -S lodash
npm i -D @types/lodash

설치 후 이전과 같이 모듈을 사용하기 만하면됩니다.

import * as _ from 'lodash'


Modified text is an extract of the original Stack Overflow Documentation
아래 라이선스 CC BY-SA 3.0
와 제휴하지 않음 Stack Overflow