>웹 프론트엔드 >JS 튜토리얼 >npm 패키지의 절대 경로 문을 트랜스파일하는 Ts

npm 패키지의 절대 경로 문을 트랜스파일하는 Ts

WBOY
WBOY원래의
2024-08-29 12:41:52830검색

오늘 저는 라이브러리, .d.ts 파일, 상대 경로와 관련된 복잡한 Typescript 상황에 직면했습니다.


우리는 npm에 React 구성 요소(유형 포함) 라이브러리를 게시합니다.

저희 프런트엔드 프로젝트에는 다른 npm 패키지와 마찬가지로 이 라이브러리가 포함되어 있습니다.

일반적으로 프런트엔드 프로젝트에는 tsconfig.json에 "skipLibCheck: true" 옵션이 있습니다.

Ts transpiling absolute path statements in your npm package

우리 앱 중 하나에는 이 플래그가 없습니다(기본적으로 이 플래그는 비활성화되어 있으며 솔직히 누가 이 동작을 원하는지 모르겠습니다)

Ts transpiling absolute path statements in your npm package


사실 거기에 플래그가 없었고 ts 오류가 발생했습니다.

Ts transpiling absolute path statements in your npm package

그리고 그것은 공정한 오류였습니다. 우리 라이브러리의 배포 파일이 절대 경로에서 무언가를 가져오려고 했습니다

import { Foo } from 'absolutePath';

이 줄은 라이브러리 자체에서는 의미가 있지만 node_modules/bla/bla/bla에서는 의미가 없습니다

Ts 말이 맞습니다. 이 절대 경로가 여기에 있나요?

Ts transpiling absolute path statements in your npm package

dist/ 폴더를 파헤쳐 일부 결과 구성 요소 파일이 상대 경로를 사용하여 올바르게 트랜스파일되었는지 확인했습니다.

Ts transpiling absolute path statements in your npm package


패닉 순간: 일부 트랜스파일된 .d.ts 파일은 절대 경로를 사용하고 다른 파일은 상대 경로를 사용하는 이유 ???


나중에 GitHub의 여러 Stack Overflow 게시물과 문제, 스레드 및 토론(작동하지 않은 내용은 건너뛰겠습니다)

빌드 시간에 초대 경고를 발견했습니다.

Export of «module» was reexported through «file» 
while both modules are dependencies of each other 
and will end up in different chunks by Rollup.

Ts transpiling absolute path statements in your npm package

그래서... 순환 종속성 그렇군요.


import 문의 순환 종속성을 해결했으며 이제 모든 것이 정상입니다.

TL;DR

Ts와 관련된 문제가 발생했다면? 라이브러리의 상대 경로 대신 절대 경로 문을 트랜스파일합니다.
클라이언트 앱에서 Ts 오류가 발생하는 경우 소스 코드의 순환 종속성이 원인일 수 있습니다.

--
읽어주셔서 감사합니다

X의 내 원본 스레드

위 내용은 npm 패키지의 절대 경로 문을 트랜스파일하는 Ts의 상세 내용입니다. 자세한 내용은 PHP 중국어 웹사이트의 기타 관련 기사를 참조하세요!

성명:
본 글의 내용은 네티즌들의 자발적인 기여로 작성되었으며, 저작권은 원저작자에게 있습니다. 본 사이트는 이에 상응하는 법적 책임을 지지 않습니다. 표절이나 침해가 의심되는 콘텐츠를 발견한 경우 admin@php.cn으로 문의하세요.
이전 기사:ReactJS 소개다음 기사:ReactJS 소개