img src 放绝对路径报错_vue脚手架中出现的报错（一）

在vue使用的过程中会碰上各种各样的报错，我现在来整理一下，方便查询。

一、vue中创建组件碰上的报错

在components文件夹下创建同级组件Hello.vue，在主组件App.vue中调用，我先在script标签中引入地址import Hello from "./components/Hello";然后在methods下components: {

Hello

}

然后就会出现下图的报错，我百思不得其解我没用sass啊，可是我忘了，我使用的是快捷键，在Hello.vue页面自动生成作用于局部的标签<style lang="scss">

</style>

我打开页面一行一行的排查，看见多了这个标签，删除之后就恢复正常了或者把lang="scss"删除就OK了。

二、动态创建img

众所周知（用下达康书记的经典语句）在vue中放置图片的有两个文件夹一个static静态资源还有一个是在src下的assets，这两个有什么区别呢，assets是相对，里边的文件是压缩之后的；static是绝对没有压缩之前的文件，下边就是实现动态img的小案例；

在vue文件中我写一个<img src="./../assets/1 (2).jpg" alt>标签浏览器可以显示图片，我理所应当的就认为动态创建的时候也可以我就循环图片了<img alt='图片无效' v-for="(ite,index) in img" :src="ite" :key=index width="200px" height="120px" >，然后在data里边我写下如下代码：使用的是assets下的图片

img: [

"./../assets/1 (2).jpg",

"./../assets/1 (2).jpg",

"./../assets/1 (2).jpg",

"./../assets/1 (4).jpg",

"./../assets/1 (5).jpg"

],

不负所望的它图片不显示，检查的时候，显示有img就是没有宽高，如下图：

当我换成在static下的图片就可以了

img: [

"../../static/1 (6).jpg",

"../../static/1 (2).jpg",

"../../static/1 (7).jpg",

"../../static/1 (4).jpg",

"../../static/1 (5).jpg"

],

这样写的话，动态图片完美显示！！！