Vue.js - Webpack을 통해 차트 구성 요소 등록

Question

Vue.js 앱이 있습니다. vue-charts 패키지를 사용하려고합니다. 내가하는 index.js에서 차트 모듈을 수입하고있어이 같은 파일 :

<template> 
    <div class="page"> 
    <h2>Hello</h2> 

    <chartjs-line></chartjs-line> 
    </div> 
</template> 

<script> 
    export default { 
     data() { 
      return {}; 
     } 
    }; 
</script> 

단어가 "안녕하세요"가 나타납니다 :

import chartJS from 'chart.js'; 
import VueCharts from 'hchs-vue-charts'; 
Vue.use(VueCharts); 

그런 다음 내 index.vue 파일에, 나는 다음과 같은이 잘 됐네. 그런 이유로, 내 애플 리케이션이 제대로 탑재되고 있다는 것을 압니다. 그러나 차트가 나타나지 않습니다. devtools 창을 보면 다음 오류가 표시됩니다.

알 수없는 사용자 정의 요소 : - 구성 요소를 올바르게 등록 했습니까? 재귀 구성 요소의 경우 "이름"옵션을 제공해야합니다.

Vue.use을 호출했을 때 구성 요소가 등록된다고 가정했습니다. 그러나 나는 분명히 잘못하고있다. 그러나, 나는 무엇이 확실하지 않다. 단일 파일 구성 요소에서 vue-charts 구성 요소는 어떻게 사용합니까?

Answer 1

How to use in vue components of webpack?에 따르면 vue-charts은 웹팩 가져 오기를 완전히 지원하지 않으므로 window.VueCharts을 통해 참조해야합니다.

import 'chart.js'; 
import 'hchs-vue-charts'; 

Vue.use(window.VueCharts);