求教一个 vue3 图片路径的问题

[humbass]

图片文件托管在 cdn 上，例如某个文件的网址是 https://static.aaa.com/pic/123.png

实际在数据库中存的地址为 pic/123.png ，有没有办法在 img 标签中直接使用 pic/123.png ，无论是开发环境还是打包环境可以自动根据配置加上 https://static.aaa.com/

[wdssmq]

环境变量和模式 | Vite 官方中文文档
https://cn.vitejs.dev/guide/env-and-mode.html#env-variables-and-modes

[ivslyyy]

这个路径放环境变量里，然后代码里写一个函数，用来拼接路径。图片路径从接口拿到的时候，用这个函数套一下。

[cctvabu]

设置环境变量 然后封装一个方法就行了

[wunonglin]

https://angular.io/guide/image-directive

这个问题是工程化的问题。你应该写个组件或者指令去做这件事情，而不是直接修改 img 的 src ，可以参考 angular 怎么做的

[humbass]

@cctvabu 目前就是用个方法，感觉所有地方都要套一下，很土的样子 :)

[vacker]

建议后端返回数据的时候加

[cctvabu]

@humbass 那就直接让后端拼好就行，这种东西他们很好处理的。前端不用那么纠结。

[humbass]

@cctvabu 有些情况是前端通过 token 上传文件到 oss, 返回的路径是不带的 url 前缀的，vite 应该有一个配置，可以直接支持某种字符串开头的，直接加上 cdn 地址。

[867380699]

用 Service Worker 可以实现

[fqy12300]

https://cn.vitejs.dev/guide/build.html#advanced-base-options 不知道这个对你有没有帮助