问题
在 Vue.js 中，使用 “@” 符号作为别名来引用项目中的相对路径是一个常见的做法。如果你在 VSCode 中使用这种方式，但是 VSCode 不能正确识别别名，则可能是由于你的项目没有正确配置别名导致的。
解决
尝试1
要让 VSCode 能够正确识别别名，你需要在项目中的 jsconfig.json 或 tsconfig.json 文件中添加一个别名配置。以下是一个例子：
{
"compilerOptions": {
"baseUrl": ".",
"paths": {
"@/*": ["src/*"]
}
}
}
这个配置将 @ 符号映射到 src 目录，你可以根据你的项目结构和需要进行调整。
另外，如果你使用的是 Vue CLI 创建的项目，它已经默认配置了别名，你可以在 vue.config.js 文件中查看或修改这些配置。
在完成配置后，VSCode 应该能够正确识别你的别名了。
尝试2
如果你使用的是 Vite 作为构建工具，你需要在你的 Vite 配置文件 vite.config.js 中进行别名的配置。
以下是一个示例 vite.config.js 文件，展示了如何在 Vite 中配置别名：
import path from 'path';
export default {
resolve: {
alias: {
'@': path.resolve(__dirname, 'src')
}
}
};
在这个示例中，我们使用 Node.js 的 path 模块来获取项目根目录，并将别名 @ 映射到 src 目录。
注：使用 Node.js 的 path 模块来处理文件路径,安装命令：
npm i --save-dev @types/node
你也可以在别名配置中使用其他路径别名和模式匹配，例如：
import path from 'path';
export default {
resolve: {
alias: {
'@': path.resolve(__dirname, 'src'),
'@components': path.resolve(__dirname, 'src/components'),
'@views/*': path.resolve(__dirname, 'src/views/*')
}
}
};
这个示例中，我们使用了 @components 和 @views/* 两个别名，其中 @views/* 使用了通配符来匹配所有以 src/views/ 开头的文件路径。
完成配置后，你就可以在你的 Vue.js 项目中使用 @ 符号作为别名来引用相对路径了。
尝试3
如果你在 VSCode 中使用了 “Vue Language Features (Volar)” 扩展，并将它配置为代码格式化程序，但是在尝试格式化 TypeScript 文件时出现了类似于 “FormattingExtension ‘Vue Language Features (Volar)’ is configured as formatter but it cannot format ‘TypeScript’-files” 的错误信息，可能是因为该扩展本身不支持格式化 TypeScript 文件导致的。
为了解决这个问题，你可以尝试使用其他支持 TypeScript 格式化的扩展，例如 “Prettier” 或 “ESLint”。以下是如何配置 Prettier 扩展作为代码格式化程序的示例：
安装 “Prettier” 扩展。在 VSCode 中打开扩展面板，搜索 “Prettier” 并安装。
在你的项目中安装 Prettier 依赖。在终端中进入你的项目目录，并执行以下命令：
npm install --save-dev prettier
在项目根目录下创建 .prettierrc.js 配置文件，并添加以下内容：
Copy code
module.exports = {
semi: true,
trailingComma: "all",
singleQuote: true,
printWidth: 120,
tabWidth: 2,
};
这个配置文件定义了 Prettier 的格式化规则。
在 VSCode 的设置中搜索 “Format: Default Formatter” 并选择 “Prettier”。这将使 Prettier 成为默认的代码格式化程序。
完成以上步骤后，你应该可以在 VSCode 中使用 Prettier 格式化你的 TypeScript 文件了。如果你仍然遇到问题，请检查你的 TypeScript 配置是否正确，并尝试升级或更改 “Vue Language Features (Volar)” 扩展的版本。
如果还是报错尝试4
在目录src中创建一个 shims 文件就足够。我的大部分组件仅使用脚本设置。
src/shims-vue.d.ts
declare module '*.vue';