Typescript를 사용할 때 "property does not exist on type JQuery"구문 오류를 어떻게 막을 수 있습니까?

80

내 응용 프로그램에서 한 줄의 jQuery 만 사용하고 있습니다.

$("div.printArea").printArea();

그러나 이것은 나에게 Typescript 오류를 제공합니다.

속성 'printArea'가 JQuery 유형에 존재하지 않습니까?

누군가가이 오류가 나타나는 것을 막을 수있는 방법을 말해 줄 수 있습니까?

jquery typescript

— 앨런 2
소스

188

<any>자신의 메소드를 추가하기 위해 jquery 타이핑을 캐스트 하거나 확장 할 수 있습니다.

 (<any>$("div.printArea")).printArea();

// 또는 사용자 지정 메서드를 추가합니다 (사용자 지정 플러그인의 일부로 직접 추가되었다고 가정).

interface JQuery {
    printArea():void;
}

— PSL
소스

저를주는 :Error:(44, 23) TS2339: Property 'printArea' does not exist on type 'ElementFinder'.

— user47376

interface JQuery외부 모듈에서 방법 을 시도하고 함수 매개 변수를 JQuery 유형으로 정의하고 다른 파일에서 호출하려고 시도하면 TypeScript는 관련되지 않은 JQuery라는 두 가지 유형이 있다고 불평합니다.

— Sam Rueby

인터페이스를 선언하는 것이 잘 작동하는 것 같습니다. 또한 모든 곳에서 <any>로 캐스팅하는 것보다 훨씬 더 깨끗합니다.

— Decoded

이것은 나를 위해 작동하지 않았지만 결국 stackoverflow.com/questions/30960386/…을 우연히 발견 declare global { ... }하고 인터페이스 선언이 필요하다는 것을 깨달았습니다 .

— James Hopkin

44

나는 이것이 가장 읽기 쉬운 해결책이라고 생각합니다.

($("div.printArea") as any).printArea();

— 엘다 미르
소스

12

캐스트 할 수 있습니다.

(<any>$('.selector') ).function();

예 : jquery를 사용하여 날짜 선택기 초기화

(<any>$('.datepicker') ).datepicker();

— 비슈누
소스

3

예를 들어 다음을 추가합니다.

interface JQuery{
    printArea():void;
}

편집 : 죄송합니다, basarat은 아래에 정확합니다. 왜 컴파일한다고 생각했는지 모르겠지만이 답변을 업데이트했습니다.

— AlexB
소스

아니. 그는 $로 개체를 감싸고 있습니다. 그것은 정적 $ 더 이상 아니다

— basarat

흠, 확실해? 나는 프로젝트에서 그것을 테스트했고 그것은 작동했습니다.

— AlexB 2014

예. 귀하의 케이스 $.inviewport(el)Ops 케이스$('selector').printArea

— basarat 2014-07-28

미안 해요, 삐걱 거리는 뜻은 아니지만 제 코드는 저에게 효과적입니다. 문제는 코드를 컴파일하는 것에 관한 것 같습니다. 그래서 내 코드가 컴파일된다면 그 문제는 무엇입니까? printArea ()를 사용하는 두 번째 예제도 작동합니다.

— AlexB 2014

$('selector').printArea컴파일? 나는 그렇게 생각하지 않는다. $.printArea그래도 컴파일됩니다. 악의 촬영하거나 :) 구성, 그래서 당신은 매우 정중되었습니다

— basarat을

2

printArea는 jQuery 플러그인이므로 jquery.d.ts에 포함되지 않습니다.

jquery.printArea.ts 정의 파일을 생성해야합니다.

플러그인에 대한 완전한 정의 파일을 만들면 DefinitelyTyped 에 제출할 수 있습니다 .

— 알빈 순 난보
소스

그리고 tsconfig.json도 올바르게 설정되었는지 확인하십시오. "유형"설정이있는 경우 나열된 유형 만 인식됩니다. 그렇지 않으면, 그것은 / node_modules 모든 것을 인식 유형 @합니다

— 댄 Cancro

2

다음과 같이 작성할 수도 있습니다.

let elem: any;
elem = $("div.printArea");
elem.printArea();

— iqqmuT
소스

2

표기법을 사용하는 대신에 무시 구문을 사용할 수도 있습니다.

// @ts-ignore
$("div.printArea").printArea();

— Guntram
소스