在日常的專案開發中,經常會引用css,less,js,img
等的檔案的路徑問題,之前也有些模糊,現在記錄下來,方便自己清晰的理解一遍,也方便以後使用。
首先說說最常見的./
../
兩種
./
:是指當前目錄下
../
:是指父級目錄下
接下來再說說@
@
就是你在build
資料夾下webpack.base.conf.js
檔案中的resolve
目錄下配置的
resolve:
},
你還可以配置其他的路徑,比如說你的專案層級較深,引入路徑很繁瑣。例如
resolve:
},
注意,配置好了,要重啟專案哦,我再這裡也花了好久的時間,感覺一直不生效,最後重啟了專案,才好了
其實他就是相對路徑,舉個例子,一看便知,我也是遇到坑了爬了好久才出來,之前我再專案中應用乙個公共的less,怎麼寫都不生效,也不知道為啥,後來不斷搜尋詢問,也是加了乙個
~
才好了
@import url('~@/components/tigerbasecss/index');
經過這次爬坑,好好了解了一下~
的作用,才明白,原來是這樣
~
表示該符合後面值是從你的webpack.base.conf.js
檔案中的resolve
目錄下配置的路徑去找的。
@import url('~@/components/tigerbasecss/index');
就相當於是
@import url('src/components/tigerbasecss/index');
或者說你配置的
看到這裡大概已經了解了把,還有什麼不足的,大家多提出,及時改正。 如何在Vue專案中配置路徑別名
首先在當前專案的根目錄下建立乙個vue.config.js的檔案,這個檔案在vue腳手架3中不會自己建立,需要自己手動建立,建立完成後新增如下 module.exports 上述 中 alias物件中的 鍵 相當於路徑的別名 而 值 相當於具體的路徑 這樣我們的路徑別名就配置好了,在專案中我們再也不...
關於vue專案中路徑跳轉
為什麼host和hostname返回的都是一樣的,卻還是分別分為兩個字段進行返回?還有host或者hostname和origin有什麼區別呀?然後我就在瀏覽器位址列中輸入上面三個,發現都可以訪問到 覺得還好,應該沒什麼區別,然後我就在一次頁面跳轉的時候,選擇了使用window.location.hr...
vue專案中api index中的配置
首先安裝模組yarn add axios 1.引入axios模組 import axios from axios 2.全域性配置 axios.defaults.baseurl 最後打包改為你伺服器的 3.新增請求 axios.interceptors.request.use function con...