欧美bbbwbbbw肥妇,免费乱码人妻系列日韩,一级黄片

vue引用public目錄下文件的方式詳解

 更新時(shí)間:2022年08月01日 09:03:06   作者:super美少女戰(zhàn)士  
由于一些演示需要對(duì)一些簡(jiǎn)單頁(yè)面進(jìn)行配置,由于打包build后的vue項(xiàng)目基本已經(jīng)看不出原樣,因此需要?jiǎng)?chuàng)建一個(gè)文件,并在打包的時(shí)候不會(huì)進(jìn)行編譯,所以文件放在public,下面這篇文章主要給大家介紹了關(guān)于vue引用public目錄下文件的相關(guān)資料,需要的朋友可以參考下

有時(shí)候我們?cè)陂_(kāi)發(fā)h5時(shí)候,會(huì)有需要綁卡授權(quán)操作,這個(gè)時(shí)候需要同意某些協(xié)議并且這些協(xié)議是可以點(diǎn)擊打開(kāi)的,這種該怎么做呢?
其實(shí)這就是一個(gè)鏈接,前端能夠打開(kāi)鏈接并且常用的也就是a標(biāo)簽喝vue自帶的router-link,當(dāng)然其他還有,通常來(lái)說(shuō)a標(biāo)簽就夠了

關(guān)于協(xié)議的存儲(chǔ),這里簡(jiǎn)單說(shuō)下,在實(shí)際開(kāi)發(fā)中,協(xié)議存儲(chǔ)有以下幾種:

1、存放在前端,一種是直接放在public靜態(tài)資源文件夾下,webpack打包不會(huì)對(duì)其處理,直接把文件復(fù)制到存放項(xiàng)目的工程目錄下;還有一種就是托管在cdn上,類似靜態(tài)資源托管,會(huì)有一個(gè)域名,這個(gè)域名下放的都是靜態(tài)資源比如圖片呀之類的。通常來(lái)說(shuō),第一種最簡(jiǎn)單。

2、存放在一個(gè)中臺(tái),這個(gè)中臺(tái)不是系統(tǒng)不是一個(gè)項(xiàng)目,而是公司內(nèi)一個(gè)組織劃分,支撐著其他部門的項(xiàng)目,通常就是前端編寫(xiě)協(xié)議內(nèi)容,然后把協(xié)議存放的絕對(duì)路徑給到中臺(tái)相應(yīng)開(kāi)發(fā),他們會(huì)做些處理最后返回一個(gè)完整的帶有域名的文件地址,比如http:xxxx/zyxj/1.html,然后把帶有詳細(xì)信息返回給前端,前端直接渲染。

以上倆種方法我都參與過(guò),今天說(shuō)第一種。

第一種就是把靜態(tài)資源放在public里面,vue頁(yè)面地址的話填寫(xiě)絕對(duì)路徑,就是不需要帶有public前綴,因?yàn)閷?shí)際上線的話,webpack是吧public下面很多文件復(fù)制到根目錄/或者某個(gè)項(xiàng)目目錄下,比如/index.html,1.css,1.html或者myapp/index.html,1.css,1.html。

頁(yè)面使用的話如截圖:

??注意?? 上面說(shuō)的情況生產(chǎn)部署到根目錄下頁(yè)面上使用的方法,但是我們?cè)趺粗理?xiàng)目是不是部署到根目錄呢?

1、配置文件查看項(xiàng)目部署位置:

如果你的項(xiàng)目不是部署在跟目錄,但是也不知道具體部署到哪個(gè)目錄,不用擔(dān)心,只要在config文件做個(gè)判斷如果是生產(chǎn)環(huán)境部署到哪里,如下:

const BASE_URL=process.env.NODE_ENV==='production'?'Utility':'/'
publicPath:BASE_URL
data(){
return {
publicPath:process.env.BASE_URL
}
}

總結(jié) 

到此這篇關(guān)于vue引用public目錄下文件的文章就介紹到這了,更多相關(guān)vue引用public文件內(nèi)容請(qǐng)搜索腳本之家以前的文章或繼續(xù)瀏覽下面的相關(guān)文章希望大家以后多多支持腳本之家!

相關(guān)文章

  • Vue?element?ui用戶展示頁(yè)面的實(shí)例

    Vue?element?ui用戶展示頁(yè)面的實(shí)例

    這篇文章主要介紹了Vue?element?ui用戶展示頁(yè)面的實(shí)例,具有很好的參考價(jià)值,希望對(duì)大家有所幫助。如有錯(cuò)誤或未考慮完全的地方,望不吝賜教
    2023-05-05
  • 關(guān)于vue面試題匯總

    關(guān)于vue面試題匯總

    本文給大家收藏整理了關(guān)于vue面試題匯總的一些知識(shí),需要的朋友可以參考下
    2018-03-03
  • vue動(dòng)態(tài)綁定background的方法

    vue動(dòng)態(tài)綁定background的方法

    background是background-color,background-image,background-repeat,background-attachment,background-position,background-size等屬性的縮寫(xiě),本文我用動(dòng)態(tài)綁定background-image來(lái)舉例,感興趣的朋友跟隨小編一起看看吧
    2023-10-10
  • 在vue項(xiàng)目如何使用base64加密

    在vue項(xiàng)目如何使用base64加密

    這篇文章主要介紹了在vue項(xiàng)目如何使用base64加密,具有很好的參考價(jià)值,希望對(duì)大家有所幫助。如有錯(cuò)誤或未考慮完全的地方,望不吝賜教
    2022-06-06
  • 解決vue watch數(shù)據(jù)的方法被調(diào)用了兩次的問(wèn)題

    解決vue watch數(shù)據(jù)的方法被調(diào)用了兩次的問(wèn)題

    這篇文章主要介紹了解決vue watch數(shù)據(jù)的方法被調(diào)用了兩次的問(wèn)題,具有很好的參考價(jià)值,希望對(duì)大家有所幫助。一起跟隨小編過(guò)來(lái)看看吧
    2020-11-11
  • vue中uni-app 實(shí)現(xiàn)小程序登錄注冊(cè)功能

    vue中uni-app 實(shí)現(xiàn)小程序登錄注冊(cè)功能

    這篇文章主要介紹了uni-app 實(shí)現(xiàn)小程序登錄注冊(cè)功能,文中給大家介紹了實(shí)現(xiàn)思路,以及vuex和本地緩存的區(qū)別,需要的朋友可以參考下
    2019-10-10
  • element-ui 中使用upload多文件上傳只請(qǐng)求一次接口

    element-ui 中使用upload多文件上傳只請(qǐng)求一次接口

    這篇文章主要介紹了element-ui 中使用upload多文件上傳只請(qǐng)求一次接口,文中通過(guò)示例代碼介紹的非常詳細(xì),對(duì)大家的學(xué)習(xí)或者工作具有一定的參考學(xué)習(xí)價(jià)值,需要的朋友們下面隨著小編來(lái)一起學(xué)習(xí)學(xué)習(xí)吧
    2019-07-07
  • vue項(xiàng)目中使用require.context引入組件

    vue項(xiàng)目中使用require.context引入組件

    本文主要介紹了vue項(xiàng)目中使用require.context引入組件,文中通過(guò)示例代碼介紹的非常詳細(xì),對(duì)大家的學(xué)習(xí)或者工作具有一定的參考學(xué)習(xí)價(jià)值,需要的朋友們下面隨著小編來(lái)一起學(xué)習(xí)學(xué)習(xí)吧
    2022-08-08
  • vue+element-ui JYAdmin后臺(tái)管理系統(tǒng)模板解析

    vue+element-ui JYAdmin后臺(tái)管理系統(tǒng)模板解析

    這篇文章主要介紹了vue+element-ui JYAdmin后臺(tái)管理系統(tǒng)模板解析,文中通過(guò)示例代碼介紹的非常詳細(xì),對(duì)大家的學(xué)習(xí)或者工作具有一定的參考學(xué)習(xí)價(jià)值,需要的朋友們下面隨著小編來(lái)一起學(xué)習(xí)學(xué)習(xí)吧
    2020-07-07
  • el-tab設(shè)置默認(rèn)激活的標(biāo)簽頁(yè)實(shí)現(xiàn)步驟

    el-tab設(shè)置默認(rèn)激活的標(biāo)簽頁(yè)實(shí)現(xiàn)步驟

    這篇文章主要給大家介紹了關(guān)于el-tab設(shè)置默認(rèn)激活的標(biāo)簽頁(yè)實(shí)現(xiàn)步驟,文中通過(guò)代碼介紹的非常詳細(xì),對(duì)大家的學(xué)習(xí)或者工作具有一定的參考借鑒價(jià)值,需要的朋友可以參考下
    2023-09-09

最新評(píng)論