vue-cli3访问public文件夹静态资源的报错解决
今天在项目中使用了public文件夹里的静态资源,在本地测试没有发现问题,但是项目部署到fat服务器却报了404错误。我发现原因在于我的项目没有部署在域名的根部,而我引用public文件是通过绝对路径方式引用的,因为就出现了路径错误。路径如下:<img :src="`/image1.png`">在官网文档中发现这种情况需要为 URL 配置 publicPath 前缀:proc...
·
今天在项目中使用了public文件夹里的静态资源,在本地测试没有发现问题,但是项目部署到fat服务器却报了404错误。
我发现原因在于我的项目没有部署在域名的根部,而我引用public文件是通过绝对路径方式引用的,因为就出现了路径错误。
路径如下:
<img :src="`/image1.png`">
在官网文档中发现这种情况需要为 URL 配置 publicPath 前缀:process.env.BASE_URL
正确的引用路径是:
<img :src="`${process.env.BASE_URL}image1.png`">
当然,最好避免将文件放在public文件夹,因为任何放置在 public 文件夹的静态资源都会被简单的复制,而不经过 webpack。
更多推荐
已为社区贡献17条内容
所有评论(0)