【报错】路径别名Failed to resolve import “@/..“ from “src/...“ @找不到路径

原创已于 2025-02-15 13:13:04 修改 · 置顶 · 1.1w 阅读

14 ·

CC 4.0 BY-SA版权

文章标签：

#前端 #javascript #html

于 2023-11-24 00:20:24 首次发布

React 同时被 2 个专栏收录

41 篇文章

订阅专栏

Vue

25 篇文章

订阅专栏

本文介绍了如何在Vite项目中安装并使用`path`模块，以及如何在`vite.config.ts`和`tsconfig.json`中配置resolve别名，以便正确导入源文件。

安装path

npm install --save-dev @types/node

配置

// vite.config.ts 
import { defineConfig } from "vite"
import react from "@vitejs/plugin-react"

import path from "path" // 需安装此模块

// https://vitejs.dev/config/
export default defineConfig({
  plugins: [react()],
  resolve: {
    alias: {
      // 这里就是需要配置resolve里的别名
      "@": path.join(__dirname, "./src") // path记得引入
    }
  }
})

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