vue項(xiàng)目中的public文件夾

任何放置在 public 文件夾的靜態(tài)資源都會(huì)被簡(jiǎn)單的復(fù)制，而不經(jīng)過 webpack。你需要通過絕對(duì)路徑來引用它們。

引用public資源

在模板中，你首先需要向你的組件傳入基礎(chǔ) URL：

data () {return {publicPath: process.env.BASE_URL} }

然后：

<img :src="`${publicPath}my-image.png`">

處理靜態(tài)資源

靜態(tài)資源可以通過兩種方式進(jìn)行處理：

在 JavaScript 被導(dǎo)入或在 template/CSS 中通過相對(duì)路徑被引用。這類引用會(huì)被 webpack 處理。

放置在 public 目錄下或通過絕對(duì)路徑被引用。這類資源將會(huì)直接被拷貝，而不會(huì)經(jīng)過 webpack 的處理

傳送門：vue-cli官方文檔

PS：如果項(xiàng)目部署在域名根部，可以通過相對(duì)路徑引用public文件夾資源

有問題，請(qǐng)指正~

總結(jié)

以上是生活随笔為你收集整理的public文件夹访问的全部?jī)?nèi)容，希望文章能夠幫你解決所遇到的問題。

如果覺得生活随笔網(wǎng)站內(nèi)容還不錯(cuò)，歡迎將生活随笔推薦給好友。