配置别名 react+ts+vite

前情提要：

"typescript": "^4.1.6"
"vite": "^3.2.2",
"react": "^18.2.0",

1、下载

yarn add @types/node -D

2、配置vite.config.js文件

import react from "@vitejs/plugin-react";
import { defineConfig } from "vite";

/*********** 路径配置 start ******************/
import { resolve } from 'path' 

const pathResolve = (dir) => {  
  return resolve(__dirname, ".", dir)          
}

const alias = {
  '@': pathResolve("src"),
  '@views': pathResolve("src/views"),
}
/********** 路径配置 end ***************/

export default defineConfig({
    root: process.cwd(),
    plugins: [react()],
    resolve: {//配置别名  
        alias
    } 
});

仅供参考：非必要配置tsconfig.json

{
  "compilerOptions": {
    ……
    "baseUrl": ".",//配置别名
    "paths": {
        "@/*": ["src/*"], // 相对位置需要配置baseUrl才能识别，否则会报错
        "@views/*": ["src/views/*"],
    }
  },
}

重启项目即可配置成功✌

本人的项目中vite.config.js文件配置生效有用，tsconfig.json配置(无效)贴出来仅供参考

参考链接：
https://blog.csdn.net/HH18700418030/article/details/123996413
https://www.cnblogs.com/zyfenblog/p/16258249.html