Svelte项目绝对路径导入失败及VS Code类型提示异常

1. 让Vite识别绝对路径别名 #

Vite不会自动读取tsconfig.json里的paths配置，必须在vite.config.ts中手动配置路径别名：

import { defineConfig } from 'vite'
import { svelte } from '@sveltejs/vite-plugin-svelte'
import path from 'path'

export default defineConfig({
  plugins: [svelte()],
  resolve: {
    alias: {
      src: path.resolve(__dirname, './src')
    }
  }
})

2. 同步Node端TS配置 #

如果项目使用tsconfig.node.json处理Vite相关的Node端编译，需要在该文件中同步路径配置：

{
  "compilerOptions": {
    "composite": true,
    "module": "ESNext",
    "moduleResolution": "Node",
    "allowSyntheticDefaultImports": true,
    "baseUrl": ".",
    "paths": {
      "src/*": ["src/*"]
    }
  },
  "include": ["vite.config.ts"]
}

配置完成后，通过VS Code命令面板（Ctrl+Shift+P/Cmd+Shift+P）执行「TypeScript: 重启TS服务器」，确保配置生效。

3. 检查模块导入细节 #

• 确认.ts文件内的导出语法正确（比如export enum、export const或export default）。
• 如果导入的是目录，确保目录下存在index.ts作为入口文件，或者在导入时明确指定文件名（例如src/lib/objects/outlet.ts）。

4. 清理缓存 #

删除项目根目录下的node_modules/.vite文件夹，重启开发服务器，避免缓存导致的路径解析异常。

内容的提问来源于stack exchange，提问作者Ólavur Nón