@vue/cli3项目下，图片等静态文件引入问题

把用js html css 写的公司网站重构成用vue框架实现。刚入门vue,碰到很多坑，第一个就是图片文件引入问题，一直报错。

解决方案：

第一种方式：将图片资源全都放到public目录下，在js或者template,css中，通过例如<img src="/图片名称"/> 、background-img(url="/图片名称")这种绝对路径的方式来引用。特点：放在public目录下的资源，不会被webpack处理，仅仅是简单复制。【官方不推荐这种方式】

 第二种方式：【官方推荐】

将所有图片资源放在assets文件下面，同样的通过例如<img src="../assets/图片名称"/> 、background-img(url="../assets/图片名称")这种相对路径的方式来引用。特点：放在assets目录下的资源，会被webpack处理，都会被解析为一个模块依赖.特点：减少 HTTP 请求的数量。

用img标签很容易能把图片显示出来，用background每次都费劲。

用img标签，直接用 @这种方法就可以，<img src="@/assets/jd.png" alt="" />