vue cli靜態資源處理

2022-01-11 18:34:00 字數 698 閱讀 9508

vue-cli是利用webpack進行打包部署,其中靜態資源的路徑問題是乙個比較麻煩的部分。

專案中共有兩個存放靜態檔案的地方。

/static 目錄不會被webpack處理,build後複製到disk目錄下,所以.vue中使用/static絕對目錄引用的不會被webpack處理。

在元件中使用assets中的靜態檔案,通常有兩種形式的引用:

1.img標籤引用

2.background背景引用 background:url(./assets/logo.png');

webpack在處理.vue時會搜尋這兩類引用,處理方式稍有不同。

首先判斷是否是絕對路徑開頭,如果是兩種都不作處理,如果為相對路徑先搜尋該路徑是否能在src中找到,如找到並且檔案較小將被轉為base64格式,如較大將重新命名檔案並將檔案複製到static/img目錄下(./assets/pic.png變為/static/img/pic.3472138.jpg);  如果找不到,img將不做處理原樣輸出,但是background背景圖會報錯。

如果想要打包輸出的內容可在相對目錄中訪問可修改config/index.js中的

SpringMVC 處理靜態資源

springmvc 處理靜態資源 1.為甚麼會有這樣的問題 優雅的 rest 風格的資源url 不希望帶 html 或 do 等字尾 若將 dispatcherservlet 請求對映配置為 則springmvc 將捕獲web 容器的所有請求,包括靜態資源的請求,springmvc 會將他們當成乙個...

Spring MVC 靜態資源處理

spring mvc 靜態資源處理 web.xml中dispatcherservlet的配置如下 springmvcservlet name org.springframework.web.servlet.dispatcherservletservlet class contextconfigloc...

Spring Boot 靜態資源處理

在web開發中,靜態資源的訪問是必不可少的,如 js css 等資源的訪問。spring boot 對靜態資源訪問提供了很好的支援,基本使用預設配置就能滿足開發需求。spring boot 對靜態資源對映提供了預設配置 spring boot 預設將 所有訪問對映到以下目錄 classpath st...