Vue中引入echarts插件出现eslint报错

问题遇到的现象和发生背景

vue中我在下载echarts的js插件然后引用后,出现eslint问题,一直提示echarts插件中某些字母定义了但没用被引用

用代码块功能插入代码,请勿粘贴截图
<template>
  <div id="bar1" style="height:500px,width:1300px"></div>
</template>

<script>
import { onMounted, reactive } from "vue";
import * as echarts from "../static/echarts.min.js";
import axios from "axios";
export default {
  setup() {
    let data = reactive({});
    function setdata() {}
    async function getdata() {
      data = await axios.post("/ds01/orders", {
        year: 2021,
      });
      console.log(data);
    }
    onMounted(() => {
      let mychart = echarts.init(document.getElementById("bar1"));
      getdata().then(() => {
        setdata();
        mychart.setOption({});
      });
    });

    return {
      getdata,
      setdata,
      data,
    };
  },
};
</script>

<style>
</style>

运行结果及报错内容

img

img

我的解答思路和尝试过的方法
我想要达到的结果

怎么样才能在不关闭eslint的前提下解决这个报错问题

望采纳

这个问题可能是由于 echarts 中定义了一些没有使用到的变量,而你使用的 ESLint 配置中开启了 no-unused-vars 这个规则,导致报错。

要解决这个问题,你可以尝试忽略这些没有使用到的变量,在你的 ESLint 配置文件中添加如下内容:

// .eslintrc.js

module.exports = {
  // ...
  rules: {
    // ...
    'no-unused-vars': ['error', {
      vars: 'all',
      args: 'none',
      ignoreRestSiblings: true,
      varsIgnorePattern: '^(echarts|_)',
    }]
  }
}

这样,你就可以忽略 echarts 中定义的所有以 echarts 或 _ 开头的没有使用到的变量,避免出现报错了。