Vue设置路径别名@

在需要引用距离比较远的文件的时候，防止出现 ../../../...这种代码，使用路径别名 @/...直接定位到src目录下明显更为方便简洁

记录一下使用方法

1. 导包

   npm i @types/node -D

2. 修改 vite.config.js

   import { defineConfig } from 'vite'
   import vue from '@vitejs/plugin-vue'
   //引入
   import { resolve } from 'path'
   
   // https://vitejs.dev/config/
   export default defineConfig({
     //设置路径
     resolve: {
       alias: {
         '@': resolve(__dirname, 'src'),
       },
     },
     plugins: [
       vue()
     ],
   })

3. 配置 jsonconfig.json

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

4. 启动项目

大功告成