VUE脚手架项目踩坑

版本控制

vuecli的版本不同，包的结构也不同，我使用的是4.4.1版本
查看自己电脑的vuecli版本：win+R cmd vue -V

包结构如下：

3.x版本的用法没有全局VUE，main.js文件中的用法不一样，为createApp

import { createApp } from 'vue'
import App from './App.vue'
createApp(App).mount('#app')

如果使用原来的VUE方法

import Vue from "vue";
import App from './App.vue';
import router from "./router";
new Vue({
  router,
  render: h => h(App)
}).$mount("#app");

会警告：
"export ‘default’ (imported as ‘Vue’) was not found in ‘vue’
"export ‘default’ (imported as ‘VueRouter’) was not found in ‘vue-router’

解决办法：在命令行中卸载当前vuecli，再安装可以使用全局VUE的vuecli版本，再重新创建一个新项目。
具体操作：
https://blog.csdn.net/su98777/article/details/109489764

v-chart报错

导入完v-chart的包之后运行项目会报错：
This dependency was not found:

*echarts/lib/visual/dataColor in ./node_modules/echarts-liquidfill/src/liquidFill.js

解决办法：运行 npm i v-charts [email protected] -S
参考：https://blog.csdn.net/lhq15222807611/article/details/112219626