用类的方式引入Echarts插件并使用

<template>
  <div class="home">
    <div id="myChart" :style="{ width: '100%', height: '300px' }">div>
  div>
template>

<script lang="ts">
import { Options, Vue } from "vue-class-component";


@Options({
  components: {},
})
export default class Home extends Vue {

}
script>
<style scoped lang="less">

style>

Vue3+typeScript+vue-class-component。class类模式的vue3写法，怎么引入Echarts插件。滴滴大劳

https://www.cnblogs.com/goloving/p/15407340.html
https://www.jianshu.com/p/2f65e9dea4f3

首先安装echarts你应该是没问题的撒,命令行输入npm i echarts -S

第二步,你可以定义一个ts文件,专门来处理这些引用的模块,然后将模块暴露出去,代码如下
这里是写的ts代码

//我这里把Vue模块都放进来了,都是没问题的
import {Component, Vue,Prop,Watch} from 'vue-property-decorator';
// @ts-ignore
import $ from 'jquery'
// @ts-ignore
import echarts from 'echarts'
export {
    Component,
    Vue,
    $,
    Prop,
    Watch,
    echarts
}

这个文件定义好了以后,在你需要引入echarts模块的页面这样写

<script lang="ts">
import {Component, echarts, Vue} from '../untis/common';//我定义的ts文件名字叫common
@Component({
        components: {},
    })
export default class Home extends Vue {
    char: any = null;//用于存储echars的统计图对象,调用时使用this.char即可,(注意this指向问题)
    mounted(): void {
        //初始化echars,方便后续调用
         this.char = echarts.init(document.getElementById(`char`));//这里写你页面用于存放echarts的div的id
    }
}
</script>

我一直都是这么用的,如果我的回答对你有帮助,希望采纳