Vue使用echarts的兩種方案

1. 前提

首先在使用echarts的時候，要確保echarts的版本
需要掛載在mounted上面

2. 安裝

npm i [email protected] --save

ts使用 npm i @types/[email protected] --save，上面的方法也可以

3. 使用方式

3.1 全局

1. js

文件爲main.js

import echarts from "echarts"
Vue.prototype.$echarts = echarts

// 使用方式
// 例
this.$echarts.setOption()

2. ts
   修改文件main.ts，同級新建文件shim-echarts.d.ts

import echarts from "echarts"

// shim-echarts.d.ts文件內容
import Vue from 'vue'

declare module 'vue/types/vue' {
    interface Vue {
      $echarts: any
    }
}

3.2 文件內部使用

缺點：若使用次數多，則需要反覆聲明

import echarts from "echarts"
echarts.setOption()