基于最新Vite+React项目配置路径别名遇错求助

你的问题出在TS路径映射配置不匹配以及导入方式与配置的对应关系上，具体修正点如下：

1. 修正tsconfig.app.json的paths配置 #

你当前的paths只配置了@pages/*（匹配子路径），但导入时用的是@pages（直接指向目录根），TS无法识别这种无通配符的导入。需要补充一个不带通配符的映射规则：

{
  "compilerOptions": {
    "baseUrl": "./src",
    "paths": {
      "@pages/*": ["./pages/*"],
      "@pages": ["./pages"] // 新增这条，匹配直接导入@pages的情况
    }
  }
}

同时要确保src/pages目录下存在index.ts或index.tsx文件，并且正确导出Dashboard组件，示例：

// src/pages/index.tsx
export { Dashboard } from './Dashboard'; // 假设Dashboard组件在pages/Dashboard.tsx中

2. 对齐Vite与TS的别名配置 #

你的Vite alias里配置@pages指向src/pages是正确的，需保证TS的paths规则和Vite alias完全对应，避免出现识别不一致。

3. 确保主tsconfig.json继承tsconfig.app.json #

检查项目根目录的tsconfig.json，确认它正确继承了tsconfig.app.json，这样编辑器才能读取到paths配置：

{
  "files": [],
  "references": [
    { "path": "./tsconfig.app.json" },
    { "path": "./tsconfig.node.json" }
  ]
}

若缺少这个继承关系，编辑器可能不会加载tsconfig.app.json的配置，导致TS报错。

4. 重启TS服务或编辑器 #

修改完tsconfig后，打开编辑器命令面板（Ctrl+Shift+P）执行TypeScript: Restart TS Server，或者直接重启编辑器，让新配置生效。

内容的提问来源于stack exchange，提问作者robb