vue3 + ts 的环境时,提示 .vue 模块未找到

问题:找不到模块“vue”。你的意思是要将 "moduleResolution" 选项设置为 "node",还是要将别名添加到 "paths" 选项中?ts(2792)
原因:一般使用 vscode 编辑器的,在做 vue 项目时,由于历史原因,使用 Vetur 工具处理 vue2 的一些格式化、检查、snippet等工作,但在切换到 vue3 + ts 的环境时,如果这个扩展不关闭就会提示 .vue 模块未找到,根本原因还是不兼容
解决方案:

  1. 关闭vetur扩展
  2. 使用 vue3 + ts 开发的对应扩展工具是 Volar(TypeScript Vue Plugin、Vue Language Features)

将 "moduleResolution" 选项设置为 "node",这样 TypeScript 编译器就会使用 Node.js 的模块解析方式来查找 Vue 模块。在 tsconfig.json 文件中添加以下配置:

{
  "compilerOptions": {
    "moduleResolution": "node"
  }
}


将别名添加到 "paths" 选项中,这样 TypeScript 编译器就会使用别名来查找 Vue 模块。在 tsconfig.json 文件中添加以下配置:

{
  "compilerOptions": {
    "baseUrl": ".",
    "paths": {
      "@/*": ["src/*"]
    }
  }
}


这里的 "@/" 表示别名,可以根据需要修改。在项目中使用 Vue 模块时,可以这样导入:

import Vue from '@/vue'