vite中使用@配置路徑別名過程示例
更新時間：2023年08月31日 14:30:56 作者：大甜甜
這篇文章主要為大家介紹了vite中使用@配置路徑別名過程示例,有需要的朋友可以借鑒參考下,希望能夠有所幫助,祝大家多多進(jìn)步,早日升職加薪
打開 vite.config.ts 文件，配置 alias 參數(shù)
import { defineConfig } from 'vite'
import vue from '@vitejs/plugin-vue'
const path = require('path');
// https://vitejs.dev/config/
export default defineConfig({
plugins: [vue()],
resolve:{
//設(shè)置路徑別名
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" }]
}重新運(yùn)行
使用
import Home from '@/views/index/index.vue'
以上就是vite中使用@配置路徑別名過程示例的詳細(xì)內(nèi)容，更多關(guān)于vite使用@配置路徑別名的資料請關(guān)注腳本之家其它相關(guān)文章！
相關(guān)文章
Vue中的@blur事件 當(dāng)元素失去焦點(diǎn)時所觸發(fā)的事件問題
這篇文章主要介紹了Vue中的@blur事件 當(dāng)元素失去焦點(diǎn)時所觸發(fā)的事件問題，具有很好的參考價值，希望對大家有所幫助。如有錯誤或未考慮完全的地方，望不吝賜教2022-08-08
vue項(xiàng)目,代碼提交至碼云,iconfont的用法說明
這篇文章主要介紹了vue項(xiàng)目,代碼提交至碼云,iconfont的用法說明，具有很好的參考價值，希望對大家有所幫助。一起跟隨小編過來看看吧2020-07-07
詳解如何使用Vuex實(shí)現(xiàn)Vue后臺管理中的角色鑒權(quán)
最近參與了公司一個新的B端項(xiàng)目的研發(fā),從無到有搭建項(xiàng)目的過程中,遇到了關(guān)于項(xiàng)目鑒權(quán)的問題,這篇文章主要給大家介紹了關(guān)于如何使用Vuex實(shí)現(xiàn)Vue后臺管理中的角色鑒權(quán)的相關(guān)資料,需要的朋友可以參考下2022-05-05
vue element中axios下載文件（后端Python）
這篇文章主要介紹了vue element中axios下載文件（后端Python）的實(shí)例代碼，非常不錯，具有一定的參考借鑒價值 ,需要的朋友可以參考下2019-05-05
vue elementUI tree樹形控件獲取父節(jié)點(diǎn)ID的實(shí)例
今天小編就為大家分享一篇vue elementUI tree樹形控件獲取父節(jié)點(diǎn)ID的實(shí)例，具有很好的參考價值，希望對大家有所幫助。一起跟隨小編過來看看吧2018-09-09
這篇文章主要介紹了Vue傳參一籮筐(頁面、組件)，Vue頁面、組件之間傳參方式繁多，此處羅列出常用的幾種方式，小編覺得挺不錯的，現(xiàn)在分享給大家，也給大家做個參考。一起跟隨小編過來看看吧2019-04-04
Wavesurfer.js是一款基于HTML5?canvas和Web?Audio的聲紋可視化插件，功能十分強(qiáng)大，在Vue框架中嵌入使用該插件，今天重點(diǎn)給大家介紹下vue使用wavesurfer.js解決音頻可視化播放問題，感興趣的朋友一起看看吧2022-04-04
詳解vue中的父子傳值雙向綁定及數(shù)據(jù)更新問題
這篇文章主要介紹了vue中的父子傳值雙向綁定及數(shù)據(jù)更新問題，小編覺得挺不錯的，現(xiàn)在分享給大家，也給大家做個參考。一起跟隨小編過來看看吧2019-06-06
這篇文章主要介紹了Nuxt的路由配置和參數(shù)傳遞方式，具有很好的參考價值，希望對大家有所幫助。一起跟隨小編過來看看吧2020-11-11
這篇文章主要介紹了詳解Vue.js自定義tipOnce指令用法實(shí)例，小編覺得挺不錯的，現(xiàn)在分享給大家，也給大家做個參考。一起跟隨小編過來看看吧2018-12-12