vue3+ts+vite中配置“@“绝对路径

大家应该知道在Vue2的时候项目中@路径可以直接使用，不需要额外配置，但是Vue3中却需要手动配置，下面是配置方法

1. 首先 npm install @types/node --save-dev（需要用到node其中的path模块和__dirname)

2. 然后在vite.config.ts文件中进行配置，配置信息如下

import { defineConfig } from 'vite'
// 引入path
import { resolve } from 'path'
import vue from '@vitejs/plugin-vue'

// https://vitejs.dev/config/
export default defineConfig({
  plugins: [vue()],
  base: './',
  /* 路径配置 */
  resolve: { 
    alias: [
      {
        find: '@',
        replacement: resolve(__dirname, './src'),
      }
    ]
  }
})

3. 如果你没有用TS到这里就已经可以了，但是因为TS的类型检查会报错，所以下面的配置是为了解决TS不识别@的问题

{
    "compilerOptions": {

        /* 省略其他配置... */
        
        "paths": { // @ 路径配置 
            "@/*": [ "src/*" ]
        }
    }
}