vue2项目引用图片时，路径应该怎么写？

Question

以及什么情况下用SVG呢

Answer 1

一般来说静态资源都是放到 /public 目录下，然后直接在组件中按照绝对路径书写就可以了。
比如说 /public/img/bg.png 这个文件，在组件中就直接 <img src="/img/bg.png" /> 这样使用。

当然如果你愿意放到 /src/assets 里面也可以，用的时候直接 @/asstes/xxx.png 就行了。
项目在构建的时候会按照配置规则去判断对应的图片是否需要处理，以及把对应的文件名改成成处理后的文件名。
比如说我们在组件中使用 <img src="@/assets/img/bg.png" /> 在项目编译后就可能会处理成为 <img src="../../img/bg.5ab1aeed.png" /> 这样的形式。

但是我更推荐是放到 /public 目录下，这样就算后期改造成CDN资源也会方便很多。

---

另外对于是否使用 svg 的情况就看一个是否需要在前端控制图片做一些动画效果，如果不是的话，其实用什么格式都可以的，可能相对来说现在图标会使用 svg 格式多一些（毕竟都是线稿）。

Answer 2

1. 引用图片：直接require进来就好了。例如：<img :src="require(your path)">
2. 什么情况下用SVG：弄清楚svg是什么，就知道它一般适用于那些地方，可以看看网上一些资料