vite+vue3+js配置将./src变为@并自动提示

1.先执行npm下载@types/node依赖

npm i -D @types/node

2.在vite.config.js中引入path并重写./src的名字

// An highlighted block
import path from 'path' // 不引入@types/node依赖这里会报错
export default defineConfig({
  plugins: [vue()], //默认引入vue
  resolve: {
    alias: {
      // 设置别名 这里的./指的是 vite.config.js 的所载目录（根目录）下面的 src
      '@': path.resolve(__dirname, './src')
    },
    //extensions数组的意思是在import组件的时候自动补全.vue等文件后缀
    extensions: ['.mjs', '.js', '.ts', '.jsx', '.tsx', '.json', '.vue']
  },
})

3.在项目根目录下创建jsconfig.json文件并添加以下代码，不添加的话@的时候没有提示

// An highlighted block
{
    "compilerOptions": {
        "baseUrl": "./",
        "paths": {
          "@/*": ["src/*"]
        }
    },
    "exclude": [
        "node_modules"
    ]
 }