npm 배포이후 타 패키지에서 npm 패키지를 임포트하면 오류가 나옵니다
npm 배포이후
vite 를 사용하지않은 패키지에서
해당 DS npm 을 설치하고
사용하면 위와같은 오류가 나옵니다
먼가 강의대로 하면 Vite 로 이뤄진 패키지만 사용이 가능한걸까요
답변 5
1
roberto님 안녕하세요!
그렇지 않습니다. 다른분들의 질문을 보시면 오히려 윈도우에서 vite호환성이 떨어져서 create-react-app으로 진행하시는 분들도 있습니다.
스크린샷으로 올려주신 에러를 통해 추측하기로는 TypeScript 설정이 제대로 되지 않은 것 같습니다. Module parse failed: the keyword 'interface' is reversed 에러는 interface를 사용할 수 없는 파일에서 interface라는 키워드가 사용되었을 때 나타나는데요,
디버깅을 위해
파일 extension이
.ts또는.tsx가 맞는지 확인해주시고package.json에 TypeScript와 관련된 패키지들이 있는지 확인해주시고.eslint에서 TypeScript를 사용할 수 있게 설정이 되어있는지 확인해주시고tsconfig.json을 확인해봐야합니다.
2, 3번 항목은 디버깅이 어려우시면 전체 코드를 올려주시면 저도 확인해보겠습니다
0
npm publish 한패키지
tsconfig.json>
.eslintrc.cjs >
package.json>
publish 한 npm 을 가져다쓴 패키지는
npx create-next-app 으로 만든 기본 페이지 입니다
뭔가 에러 의심사항이 있을까요
디버깅중인데 잘안되네요 감사드립니다
0
너무 감사드립니다 디버깅 하며 npm 배포 과정에 대해 심도 있게 확인할수 있었습니다! 좋은기회가 됬습니다 무한감사
1
답변 감사합니다! TMI지만 제가 해외출장이 있어서 다녀오자마자 바로 촬영해서 6월중에 업데이트 할 예정입니다! 강의소식과 여기에 답변으로 공유드릴게요. 경험을 공유해주셔서 저도 감사합니다~
0
요건 좀더 궁금한데요
npm publish 를 하게되면 빌드가 일어나고
빌드 과정에서 트랜스파일링이 일어나면
타입스크립트가 자바스크립트로 변환되는것같은데
그럼 npm 에 올려진 패키지를 가져다 쓰는곳에선
자바스크립트를 쓰게 되는건가요 ?
아니면 가져다 쓸떄 타입스크립트로 다시변환이 되는걸까요?
재 생각에 오류가 있다면 피드백 부탁드립니다
정말 감사합니다
1
roberto님 안녕하세요! 질문에 대한 답변 드립니다
npm publish 를 하게되면 빌드가 일어나고
빌드 과정에서 트랜스파일링이 일어나면
타입스크립트가 자바스크립트로 변환되는것같은데:
맞습니다.
npm publish를 하기 전에 빌드 과정이 실행되며, 이 과정에서 TypeScript 파일들이 JavaScript 파일들로 트랜스파일됩니다. 이는 npm에 올려진 패키지가 JavaScript 파일들로 구성된다는 것을 의미합니다.
그럼 npm 에 올려진 패키지를 가져다 쓰는곳에선
자바스크립트를 쓰게 되는건가요:
npm에 올려진 패키지는 JavaScript 파일들로 구성되어 있기 때문에, 이 패키지를 사용하는 곳에서는 JavaScript 파일들을 사용하게 됩니다. TypeScript는 트랜스파일된 결과물인 JavaScript 파일로 변환되므로, 최종 소비자는 JavaScript를 사용하게 됩니다.
여기는 제가 경험하지 못한 부분이었는데, roberto님께서 마주하신 문제는 빌드과정에서 npm으로 배포된 패키지가 자바스크립트로 변환되지 않아서 발생하는 문제입니다
저도
create-next-app으로 프로젝트를 실시하고 강의에서 사용한 패키지를 설치하니 에러가 발생하네요tsc를 사용해서 빌드하면 JavaScript로 변환이 되어야하는데, 트랜스파일이 정상적으로 되지않아 npm에 TypeScript가 그대로 올라간 것 같습니다.Next.js는 npm 패키지는 JavaScript로 parsing하려고 하는데, 코드가 TypeScript라서 발생한 문제인 것 같습니다
아니면 가져다 쓸떄 타입스크립트로 다시변환이 되는걸까요?
Next.js의 경우
d.ts를 활용할 수 있도록 npm 패키지를 배포해야 합니다타입을 활용하려면
d.ts를 활용하는 식으로 진행해야하는데 해당 부분이 누락되었네요이 부분은 제가 에러를 확인하고 강의를 추가촬영해서 업로드하고 공지를 드리도록 하겠습니다.
스토리북에 대해서
0
57
1
Storybook 10에서 argTypes에 action 설정 시
0
74
1
storybook setup
0
86
2
실무 적용 관련해서 질문이 있습니다!
0
63
2
storybook 프로젝트 세팅 중 궁금한 점이 있습니다.
0
133
2
스토리북 테스트에 대한 질문
0
101
2
tailwind 4.x 버전 변경된 CSS 추출(?) 커맨드
1
207
2
스토리북 테마에 대해 질문 드립니다.
0
158
2
테일윈드를 안쓰고 스타일 컴포넌트만 사용하는 환경에서는요?
0
144
2
[질문 x 공유용] tailwind v4.0 으로 강의랑 다를 때 (import 다름, tailwind.config.js 없어짐 등)
6
484
2
react-toastify 를 storybook에 출력 시키기
0
181
1
react에서 modal & portal 사용시 에는 어떻게 작성해야될까요
0
374
3
tsconfig
0
180
1
vite 초기설정
0
344
2
스토리 내 args에서 에러가 발생합니다.
0
208
2
Nextjs에서 tailwind를 사용할 때
0
278
2
제공해주시는 Figma 색상 코드가 강의와 달라 글 남깁니다!
0
141
2
Visual Test
1
127
1
NavigationBar 배경색
0
129
1
defaultValue 질문 드립니다!
0
123
1
svg를 public 말고 src>assets안에 넣는다면 import를 어떻게해야하나요?
1
265
2
index.tsx 빌드 오류
0
371
2
tailwind css 코드 스플릿팅이 가능한가요?
0
279
1
StoryBook 관련 궁금 사항입니다.
1
260
1