TypeScript 2.x, @types 및 시스템에서의 Angular 1.xJS - 글로벌 타이핑 사용

TypeScript 2.x, @types 및 시스템에서의 Angular 1.xJS - 글로벌 타이핑 사용

새로운 TS2 및 @types 레지스트리에서 Angular 1.x를 사용하려고 하는데 문제가 발생하였습니다.@types는 타이핑 레지스트리가 "글로벌" 타이핑이라고 부르는 것을 사용하지 않는 것 같습니다.다음 오류가 발생했습니다.

error TS2686: 'angular' refers to a UMD global, but the current file is a module. Consider adding an import instead.

각도 코드는 다음과 같습니다.

import "angular";
import "angular-route";

const app = angular.module("charter-app", ["ui.bootstrap", "ui.router", "templates", "charter-app.controllers"]);

tsconfig.json:

{
    "compilerOptions": {
    "declaration": false,
    "emitDecoratorMetadata": true,
    "experimentalDecorators": true,
    "mapRoot": "./",
    "module": "system",
    "moduleResolution": "node",
    "sourceMap": true,
    "target": "es5",
    "inlineSources": true,
    "removeComments": false,
    "noImplicitAny": false,
    "typeRoots": [ "node_modules/@types/" ],
    "types": [ "angular", "angular-ui-bootstrap", "angular-ui-router" ],
    "outFile": "app.js"
    }
 }

다음을 사용하려고 합니다.

"devDependencies": {
    "@types/angular": "^1.5.20",
    "@types/angular-ui-bootstrap": "^0.13.35",
    "@types/angular-ui-router": "^1.1.34",

나는 편집에 굴프 타입의 원고를 사용하고 있다.제가 무엇을 빠뜨리고 있나요?이 목적으로 @types 라이브러리를 사용할 수 없습니까?

여기서는 두 가지 접근법이 생각납니다.

1) angular를 global로 표시한다.(이행 옵션이 훨씬 간단함)

작성하다d.ts파일명overrides.d.ts다음 작업을 수행합니다.

declare global {
  const angular: ng.IAngularStatic;
}
export {};

또는

import * as _angular_ from 'angular';

declare global {
  const angular: typeof _angular_;
}

그게 다야, 그럴 필요 없어import또는 스크립트 로드를 개별적으로 관리할 수도 있습니다.

2) 영향을 받는 모든 파일에 Import합니다. (대규모 기존 프로젝트에서는 더 지루한 이행 옵션일 수 있음)

영향을 받는 모든 파일을 갱신할 수 있는 경우(대부분의 경우 이미 많은 에러가 발생하고 있는 대규모 프로젝트에서는 이 접근방식을 채택하기 어렵습니다)angular, Import:

import * as angular from "angular";

이 방법을 사용하는 경우, 타이프 스크립트는 다음과 같이 변환됩니다.angular파일 및 모듈로더의 종속성(예:SystemJS)은 Import를 처리해야 합니다.이 작업은 다음 중 하나의 시스템을 사용하여 수행할 수 있습니다.JS는 맵/경로를 통해 또는 스크립트가 로딩되는지 여부를 통해 Import를 관리합니다.script태그로 가짜 모듈을 만들 수 있습니다.angular또는 apis를 사용합니다.

이 Import를 코드에 추가합니다.

import * as angular from "angularjs";

자세한 내용은 유형 스크립트 각도 가져오기를 참조하십시오.

Webstorm IDE의 파일 워처를 구축하고 있었는데, 이 문제가 발생했습니다.그걸 해결하기 위해서, 나는 그것을 제거해야만 했습니다.@types/angular,더하다typings angular또한 포함하다typings angular컴파일에서 다음 옵션을 추가해 주세요.--types {your file dir}/typings/index.d.ts마찬가지로, 이 값을 자신의 에 추가할 수 있습니다.tsconfig.json

이게 네가 바라던 해결책이 아닌건 알지만, 그게 날 그 고비를 넘겼지.

언급URL : https://stackoverflow.com/questions/40664298/angular-1-x-with-typescript-2-x-types-and-systemjs-using-global-typings