vue3+vite相對路徑的處理方式
更新時間:2023年06月05日 16:44:36 作者:kidrue
這篇文章主要介紹了vue3+vite相對路徑的處理方式,具有很好的參考價值,希望對大家有所幫助。如有錯誤或未考慮完全的地方,望不吝賜教
vue3+vite相對路徑處理
import { resolve } from 'path';
function pathResolve(dir: string) {
return resolve(process.cwd(), '.', dir);
}
// const root = process.cwd();
//以下為vite-config 輸出的配置
resolve: {
alias: [//別名
// /@/xxxx => src/xxxx
{
find: /\/@\//,
replacement: pathResolve('src') + '/',
},
// /#/xxxx => types/xxxx
{
find: /\/#\//,
replacement: pathResolve('types') + '/',
},
],
},<template>
<ConfigProvider :locale="getAntdLocale">
<AppProvider>
<RouterView />
</AppProvider>
</ConfigProvider>
</template>
<script lang="ts" setup>
//使用例子
import { ConfigProvider } from 'ant-design-vue';
import { AppProvider } from '/@/components/Application';
import { useTitle } from '/@/hooks/web/useTitle';
import { useLocale } from '/@/locales/useLocale';
// support Multi-language
const { getAntdLocale } = useLocale();
// Listening to page changes and dynamically changing site titles
useTitle();
</script>使用 /@/ 即可為相對路徑
vue3+vite打包配置相對路徑
在 vite.config.js 下加上 base: ‘./’
如下所示
import { defineConfig } from 'vite'
import vue from '@vitejs/plugin-vue'
// https://vitejs.dev/config/
export default defineConfig({
? plugins: [vue()],
? base: './'
})總結(jié)
以上為個人經(jīng)驗,希望能給大家一個參考,也希望大家多多支持腳本之家。
相關(guān)文章
復(fù)刻畫龍產(chǎn)品vue實現(xiàn)新春氣泡兔
這篇文章主要為大家介紹了復(fù)刻畫龍產(chǎn)品之使用vue實現(xiàn)新春氣泡兔示例詳解,有需要的朋友可以借鑒參考下,希望能夠有所幫助,祝大家多多進步,早日升職加薪2023-01-01
利用Vue的v-for和v-bind實現(xiàn)列表顏色切換
這篇文章主要介紹了利用Vue的v-for和v-bind實現(xiàn)列表顏色切換,具有很好的參考價值,希望對大家有所幫助。一起跟隨小編過來看看吧2020-07-07
vue 如何添加全局函數(shù)或全局變量以及單頁面的title設(shè)置總結(jié)
本篇文章主要介紹了vue 如何添加全局函數(shù)或全局變量以及單頁面的title設(shè)置總結(jié),非常具有實用價值,需要的朋友可以參考下2017-06-06
vue-cli3在main.js中console.log()會報錯的解決
這篇文章主要介紹了vue-cli3在main.js中console.log()會報錯的解決方案,具有很好的參考價值,希望對大家有所幫助。如有錯誤或未考慮完全的地方,望不吝賜教2022-04-04
vue-router鉤子函數(shù)實現(xiàn)路由守衛(wèi)
這篇文章主要介紹了vue-router鉤子函數(shù)實現(xiàn)路由守衛(wèi),對vue感興趣的同學(xué),可以參考下2021-04-04
想到頭禿也想不到的Vue3復(fù)用組件還可以這么hack的用法
這篇文章主要為大家介紹了想到頭禿也想不到的Vue3復(fù)用組件還可以這么hack的用法詳解,有需要的朋友可以借鑒參考下,希望能夠有所幫助,祝大家多多進步,早日升職加薪2023-04-04

