第一步:在 vite.config.ts 里面配置
注意: require 可能会报错,可以终端执行 cnpm i --save-dev @types/node,这一点 vscode 提示做的很好
import { defineConfig } from 'vite'
import vue from '@vitejs/plugin-vue'
const { resolve } = require('path')
// https://vitejs.dev/config/
export default defineConfig({
plugins: [vue()],
resolve: {
alias: [
{
find: '@',
replacement: resolve(__dirname, 'src')
}
]
}
})
第二步:在 tsconfig.json 里面 compilerOptions 下面 增加别名配置
{
"compilerOptions": {
...
"baseUrl": ".",
"paths": {
"@/*": ["src/*"]
}
}
}
第三步:直接在页面引入文件中使用 @,例如
import Home from '@/views/home'