新建vue3项目报错问题 setup vetur export vue.js

【新建vue3项目报错问题 setup vetur export】最近在学习Vue3的过程中一创建项目就报错，翻来覆去网上也没有解释的文章（也有可能是我搜索的关键词不对），总之给最近新学vue3的小伙伴们提个醒，也是方便大家更好的入门vue3

新建vue3项目中的app.vue

文章图片

为什么一新建就报错呢？这里的报错是因为vetur插件不兼容Vue3的语法
只要禁用vetur，再安装vue3的插件-例如volar

文章图片

重启vscode即可。
然而，在编写时也会碰到错误，写一个export就会报错，这是为什么呢？vue3不就是用export中的setup进行组合式API的编写吗

文章图片

这是因为在Vue3.2的版本中提供了setup的语法糖，只要删掉就可以正常编写了，仔细看两图差别（import是补的，但报错问题不在于import）

文章图片

然而 setup为我们提供了什么？
当我们需要引入一个 components 时，不仅需要在文件头部显式 import 进行导入，而且需要 components 字段加入声明。不仅如此，在 setup 中声明的变量如果需要被模板使用，那么需要在 setup 的尾部显式 return 返回，如果你的组件模板使用的变量不多，那么这种情况还可以勉强接受。但是当变量和方法逐渐增加时，每次都要在 setup 后进行 return 返回，这无疑是一件枯燥的事情，在重构代码时，你也会面临巨大挑战。
为了解决这个问题，vue3添加了script setup语法糖提案。
因此加入setup后，就可以不再注意exprot 和 setup的return等，也不用注意子组件的注册了。关于setup的详细介绍，博客园上有一篇写的十分好的文章
https://www.cnblogs.com/bingc...