타입스크립트의 컴포넌트 import 절대경로
안녕하세요 멘토님
항상 좋은 강의 잘 보고 있습니다.
궁금한 점이 생겨서 문의를 드렸는데요,
수업을 하면서는 몰랐는데 타입스크립트와 graphql-codegen에 대하여 강의를 들으면서 09-01 폴더를 10-01로 복사 후, 수업 후반부까지 import 부분에서 계속 빨간줄이 뜨길래 원인을 한참 찾았는데
알고보니 저는 여태까지 컴포넌트를 import 할 때 절대경로를 사용하고 있었습니다. (import 할 때 자동완성 사용)
왜 인지는 모르겠지만 .js 파일까지는 절대 경로를 사용해도 문제가 없었는데 타입스크립트로 변환을 하니까 여태 잘 사용하던 절대경로가 빨간줄이 계속 뜨고 상대경로를 입력하니까 빨간줄이 사라지더라구요.
09-01 .js 실습 파일 (빨간줄 없이 정상작동)
10-01 .tsx 실습 파일 (절대경로 - 빨간줄, 상대경로 - 정상 작동)
이렇게 JS에서는 되던 절대경로가 TS에서는 왜 안되는 것인지가 궁금하여 질문드렸습니다.
감사합니다!
답변 2
0
안녕하세요 BBBB님
js파일을 ts형식으로 컴파일하는 과정이 필요하기 때문에 인식을 못하게 된 이슈입니다
따라서 tsconfig에 path를 직접 지정하여 사용해주어야 합니다.
예)
{
"compilerOptions": {
"baseUrl": ".", // 경로 시작 위치를 현재 위치로 설정
"paths": {
"@/*": ["src/*"] // @/로 시작하는 경로를 src/ 경로로 설정
},
},
}
0
안녕하세요 BBBB님!
해당 오류는 웹팩의 자바스크립트와 타입스크립트의 절대경로 설정이 다르게 이루어지기 때문에 발생하는 오류 입니다.
경로는 webpack.json에서 resolve를 이용하여 설정할 수 있는데요,
타입스크립트를 사용하는 경우엔 웹팩 설정 뿐만아니라 tsconfig 타입스크립트 설정파일에서 paths 또한 변경해주어야 합니다.
타입스크립트에서 절대경로를 사용하는 방법이 궁금하시다면, 구글링을 통해 알아보셔도 좋은 공부가 될 수 있을 것 같습니다!
웹팩에 관련한 질문을 주시다니, 너무 좋은 질문이었습니다.
감사합니다.😁
fetchBoardsOfMine, fetchBoardsCountOfMine 에러 문의드립니다
0
41
1
댓글 기능 구현 중 질문드립니다.
0
68
1
쿠폰코드 발급
0
147
2
example 서버 플레이그라운드, API 접속 모두 안됩니다.
0
89
2
문의드립니다!! ㅠㅠ
0
107
2
graphql 백엔드 서버가 포폴용 빼곤 접속이 안됩니다.
0
80
2
_app.js 작성 이후로 에러가 발생하네요
0
96
2
학습자료
0
72
2
학습자료가 안열립니다.
0
51
2
플레이 그라운드 퀴즈 문제 질문이 있습니다.
0
61
0
기존강의 구매자, 업데이트 끝인가요?
0
111
3
업데이트 버전 수강
0
89
2
완벽한 프론트엔드
0
136
2
나만의 쇼핑몰 샘플 페이지 접속 확인부탁드립니다.
0
84
1
graphql 접속이 안됩니다.
0
101
2
const, let 사용 질문 드립니다.
0
72
2
싸이월드 만들기 1탄 피드백 부탁드립니다.
0
124
2
회원가입 과제 피드백 부탁드립니다.
0
81
2
styled.span / styled.input "CSS 자동완성"
0
47
1
쿠폰 발급 관련
0
167
2
서버 502 error
0
248
2
쿠폰 다시 부탁드려도 될가여?
0
140
2
a태그 패딩했을때 왜 크기가 줄어들지 않고 늘어나나요
0
185
2
2분 44초 질문
0
132
3