vue li alias,是Vue.js中一種為路徑配置起別名的功能,它可以讓我們方便地對模塊或目錄進(jìn)行引用。
配置別名非常簡單,只需要在根目錄下的vue.config.js文件中加入以下代碼:
module.exports = {
configureWebpack: {
resolve: {
alias: {
'@': '/src',
'components': '@/components',
'api': '@/api',
'assets': '@/assets',
'views': '@/views'
}
}
}
}
上面的代碼中,我們配置了以下幾個別名:
- @ 表示根目錄下的src目錄
- components 表示根目錄下src目錄下的components目錄
- api 表示根目錄下src目錄下的api目錄
- assets 表示根目錄下src目錄下的assets目錄
- views 表示根目錄下src目錄下的views目錄
通過別名,我們可以在代碼中使用以下方式進(jìn)行引用:
import MyComponent from 'components/MyComponent.vue'
import { login } from 'api/user.js'
import logo from 'assets/logo.png'
import Home from 'views/Home.vue'
以上引用路徑就可以使用別名來代替了,讓我們的代碼更加簡潔和易于維護(hù)。