vite中使用@配置路径别名过程示例
作者：大甜甜
这篇文章主要为大家介绍了vite中使用@配置路径别名过程示例,有需要的朋友可以借鉴参考下,希望能够有所帮助,祝大家多多进步,早日升职加薪
打开 vite.config.ts 文件，配置 alias 参数
import { defineConfig } from 'vite'
import vue from '@vitejs/plugin-vue'
const path = require('path');
// https://vitejs.dev/config/
export default defineConfig({
plugins: [vue()],
resolve:{
//设置路径别名
alias: {
'@': path.resolve(__dirname, './src'),
'*': path.resolve('')
},
}
})打开 tsconfig.json 文件
{
"compilerOptions": {
"target": "esnext",
"useDefineForClassFields": true,
"module": "esnext",
"moduleResolution": "node",
"strict": true,
"jsx": "preserve",
"sourceMap": true,
"resolveJsonModule": true,
"isolatedModules": true,
"esModuleInterop": true,
"lib": ["esnext", "dom"],
"skipLibCheck": true,
"baseUrl": ".",
"paths": {
"@/*": ["src/*"]
}
},
"include": ["src/**/*.ts", "src/**/*.d.ts", "src/**/*.tsx", "src/**/*.vue"],
"references": [{ "path": "./tsconfig.node.json" }]
}重新运行
使用
import Home from '@/views/index/index.vue'
以上就是vite中使用@配置路径别名过程示例的详细内容，更多关于vite使用@配置路径别名的资料请关注脚本之家其它相关文章！