[Nuxt3] eCharts 적용 (+ 에러)

기존에 chart.js 를 이용 하다가 chart.js 보다 그래프 종류도 다양하고 사용하기도 편한 것 같아서

eCharts를 도입하기로 결정 했다

단점은 중국에서 만든거라 자료가 좀 부족한 것 말고는 괜찮다

이 마저도 공식문서를 보면 거의 다 컨트롤 가능 한 수준이다

 

SyntaxError: Cannot use import statement outside a module
....
import { __extends } from "tslib";

eCharts를 설치하고 사용하려고 하면 위와 같은 에러가 날 수 있다

여러 가지 검색을 해서 찾아봤을 땐 package.json 에 "type": "module" 을 추가하라는 글 들이 많아 적용해 보았지만

nuxt3에서는 작동하지 않았다

그래서 한참을 찾다가 nuxt.config.ts 파일에

위와 같이 추가해주니까 정상적으로 작동한다

nuxt3에서 eCharts를 사용하는 자료를 찾기가 쉽지 않아 한참을 이것 저것 찾아보다 발견했다

혹시 nuxt3에 eCharts를 적용해 나와 같은 에러가 난다면 위와 같이 적용해 보자

이걸로 다른 사람들도 시간을 아낄 수 있었으면 좋겠다