vue3创建后用vscode打开有代码错误

Question

用终端创建了一个vue3的项目，之后用vscode打开很多爆红，不知道为什么？

Answer 1

引自免费微信小程序：皆我百晓生

看起来你在VSCode中遇到了一些关于Vue3项目的配置和类型定义的问题。以下是针对你遇到的每个错误的解决步骤：

1. 缺少vite/client类型定义文件 这个错误是因为env.d.ts文件引用了未安装的类型定义。你需要安装vite的类型定义。在命令行中运行以下命令：

   npm install --save-dev @types/vite
   

2. App.vue中的默认导出问题 在Vue组件中，只能有一个默认导出（export default）。检查App.vue，确保只有一个默认导出，例如：

   <script setup>
   // ...
   </script>
   
   <!-- 或者 -->
   
   <script>
   export default {
     // ...
   }
   </script>
   

3. 找不到全局Promise 这可能是因为 TypeScript 缺少对全局 Promise 的认识。为了解决这个问题，在tsconfig.json中添加 "lib": ["esnext"]，确保它包含以下部分：

   {
     "compilerOptions": {
       "target": "esnext",
       "module": "esnext",
       "lib": [
         "esnext", // 添加这一行
         "dom"
       ],
       // ...其他选项
     },
     // ...其他配置
   }
   

4. tsconfig.app.json 文件不存在 这可能是由于你尝试导入一个不存在的配置文件。删除或修复引用，确保路径正确。

5. tsconfig.dom.json 文件找不到 同样地，确认这个文件是否真的存在于你的项目中。如果是Vue3项目，通常不需要这个文件，可以移除引用或者创建一个基本的tsconfig.dom.json文件，例如：

   {
     "extends": "@vue/typescript/tsconfig/Base",
     "compilerOptions": {}
   }
   

执行上述步骤后，保存并重新加载VSCode，应该能解决大部分问题。如果还有其他问题，请检查你的项目结构和依赖项是否正确设置。