인프런 커뮤니티 질문&답변

lsb9938님의 프로필 이미지

작성한 질문수

Vue.js 중급 강좌 - 웹앱 제작으로 배워보는 Vue.js, ES6, Vuex

스토어 속성 모듈화 방법

import 시 뜨는 에러 (타입스크립트 파일에서만 사용할 수 있습니다.)

24.01.02 13:50 작성

·

681

1

안녕하세요! 강의 잘 보고 있습니다 ㅎㅎ

다름이 아니라, import * as getters from './getters' 를 했는데 'import ... ='는 TypeScript 파일에서만 사용할 수 있습니다. ts(8002)라며 에러가 나네요 ㅠㅠ
저는 뷰 3를 이용하고 있습니다!

 

답변 2

0

장기효(캡틴판교)님의 프로필 이미지

2024. 01. 07. 14:33

안녕하세요, 말씀하신 에러는 VSCode 플러그인 상에서 나는 걸까요? 에러 화면이랑 소스 코드 첨부 부탁드릴게요 :)

lsb9938님의 프로필 이미지
lsb9938
질문자

2024. 01. 07. 22:22

앗 코드를 껐다가 다시 켰는데 해결됐습니다..ㅎㅎ
강의 교안 보면서 다시 수정해봤는데 제가 잘못 쳐서 생긴 문제 같아요!

 

0

인프런 AI 인턴님의 프로필 이미지

2024. 01. 04. 13:56

안녕하세요, 인프런 AI 인턴입니다.

lsb9938님, Vue.js 중급 강좌를 수강하시면서 발생한 문제로 보이시네요.

에러 메시지인 ‘import … =‘는 TypeScript 파일에서만 사용할 수 있습니다. ts(8002)는 일반적으로 TypeScript 파일에서만 사용되는 구문을 JavaScript 파일에서 사용했을 때 나타나는 에러입니다.

Vue 3에서는 Composition API를 활용하거나 Vuex 내부의 getters를 사용할 때는 “import { xxx } from ‘yyy’;“의 형태로 import를 해야 합니다.

import 문법을 변경해보시거나 해당 파일이 .ts 확장자인 TypeScript 파일이 맞는지 확인해보시기 바랍니다. JavaScript 환경에서는 TypeScript 특유의 import 구문을 사용할 수 없기 때문에 이를 적절한 JavaScript import 형태로 바꿔주셔야 합니다.

예를 들어, getters.js 파일이 있다면 다음과 같이 import 할 수 있습니다.

import { getterName } from './getters';

위와 같이 수정하시고 나서도 문제가 해결되지 않는 경우, 설정 파일이나 프로젝트 구조 등 다른 문제일 수 있으니 이를 재검토해보시기 바랍니다. 추가적인 도움이 필요하시면 문의하기를 통하여 지원을 받으실 수 있습니다.

문제 해결을 위해 참고하시면 좋을 것 같습니다.

도움이 되셨길 바랍니다. 감사합니다!

lsb9938님의 프로필 이미지

작성한 질문수

질문하기