1. npm下载echarts

2. 项目中引入import * as echarts from "echarts";

3. 完成效果：
   

4. 代码

// An highlighted block
<template>
  <div ref="container" :style="{ width: '90%', height: '100%' }"></div>
</template>
<script>
import * as echarts from "echarts";
import { onMounted, ref } from "vue";
export default {
  setup() {
    const container = ref(null);
    onMounted(() => {
      const chart = echarts.init(container.value, {
        width: "700px",
        height: "200px",
      });
        chart.setOption({
          xAxis: {
            type: "category",
            boundaryGap: false,
            data: [1,2,3,4],
            axisLabel: {
              formatter: "{value}月",
            },
            axisTick: {
              length: 0,
            },
          },
          yAxis: {
            type: "value",
          },
          series: [
            {
              data: [1, 2, 3, 4]
              type: "line",

              areaStyle: {
                color: new echarts.graphic.LinearGradient(0, 0, 0, 1, [
                  {
                    offset: 0,
                    color: "rgba(67, 119, 222, 0.5)",
                  },
                  {
                    offset: 1,
                    color: "rgba(67, 119, 222, 0.03)",
                  },
                ]),
              },
            },
          ],
        });
      
      window.addEventListener("resize", () => chart.resize(), false);
    });

    return { container };
  },
};
</script>