作為圖片最好放在static目錄下，但是vue@cli3沒有static，網上都說放在public目錄下，行，那就放吧，可問題是圖片放了怎麼使用

第一次嘗試

肯定用絕對路徑這就不說了，用相對路徑，webpack會解析成base64，可是絕對路徑怎麼輸都不對，咋回事

後面看網上說把前面路徑下的public路徑去掉，好，開發環境沒問題了，可打包報錯怎麼辦，就這個我研究了好久。

解決問題

網上一大堆牛頭不對馬嘴的，我也是無語了
最後的最後，終於官網找到了完美的解決方案

如此設定，完美解決問題，如果你留心觀察過，你會發現，index.html檔案的ico圖示就已經這麼使用了

 <template>
 <div class="er">
 <el-scrollbar style="height:100%">
  <div class="ds">
  <img
   class="sdde"
   :src='`${publicPath}imges/but_play.png`'
  >
  </div>
 </el-scrollbar>
 </div>
</template>

<script>
export default {
 data() {
 return {
  publicPath: process.env.BASE_URL
 }
 },components: {
 }

}
</script>

到此這篇關於vue@cli3專案模板怎麼使用public目錄下的靜態檔案的文章就介紹到這了,更多相關vue@cli3 public靜態檔案內容請搜尋我們以前的文章或繼續瀏覽下面的相關文章希望大家以後多多支援我們！