本文主要是介绍Vue3+Vite+Echarts 出现Missing semicolon错误,希望对大家解决编程问题提供一定的参考价值,需要的开发者们随着小编来一起学习吧!
使用的echarts代码如下:
import * as echarts from 'echarts';type EChartsOption = echarts.EChartsOption;var chartDom = document.getElementById('main')!;
var myChart = echarts.init(chartDom);
var option: EChartsOption;option = {series: [{type: 'gauge',center: ['50%', '60%'],startAngle: 200,endAngle: -20,min: 0,max: 60,splitNumber: 12,itemStyle: {color: '#FFAB91'},progress: {show: true,width: 30},pointer: {show: false},axisLine: {lineStyle: {width: 30}},axisTick: {distance: -45,splitNumber: 5,lineStyle: {width: 2,color: '#999'}},splitLine: {distance: -52,length: 14,lineStyle: {width: 3,color: '#999'}},axisLabel: {distance: -20,color: '#999',fontSize: 20},anchor: {show: false},title: {show: false},detail: {valueAnimation: true,width: '60%',lineHeight: 40,borderRadius: 8,offsetCenter: [0, '-15%'],fontSize: 60,fontWeight: 'bolder',formatter: '{value} °C',color: 'inherit'},data: [{value: 20}]},{type: 'gauge',center: ['50%', '60%'],startAngle: 200,endAngle: -20,min: 0,max: 60,itemStyle: {color: '#FD7347'},progress: {show: true,width: 8},pointer: {show: false},axisLine: {show: false},axisTick: {show: false},splitLine: {show: false},axisLabel: {show: false},detail: {show: false},data: [{value: 20}]}]
};setInterval(function () {const random = +(Math.random() * 60).toFixed(2);myChart.setOption<echarts.EChartsOption>({series: [{data: [{value: random}]},{data: [{value: random}]}]});
}, 2000);option && myChart.setOption(option);
出现该报错一般是符号缺少(semicolon 分号的意思),仔细检查后并无发现符号缺失或半角全角误用,仔细观察代码发现是type XX = xx,恍然大悟,需要将其改为lang = 'ts'
<script setup lang ='ts'>
遇到该报错的提示和跨域报错404有异曲同工之妙啊
这篇关于Vue3+Vite+Echarts 出现Missing semicolon错误的文章就介绍到这儿,希望我们推荐的文章对编程师们有所帮助!