vue项目sass文件找不到css背景图片：weppack报路径出错

Author：zhoulujun Date：2017-01-11 Hits：

在vue文件中，在style里面引入sccs文件，且scss文件含有图片等资源文件，就会报错。原因是，当在scss中引用图片时，编译报错，loader出错。原因是路径解析错误。

vue文件中，引入纯*.css *.scss 文件无问题。里面有图片，就提示图片路径出错。

图片路径都是使用的相对路径。在react 项目中，印象中貌似没有发现这种问题。

报错情形

在vue文件中，在style里面引入sccs文件，且scss文件含有图片等资源文件，比如

<style>
    @import './path/demo.scss'
</style>

样式文件中

.test {
    background-image:url("../ims/xxx.png");
}

原因是：当在scss中引用图片时，编译报错，loader出错。原因是路径解析错误。

相关热词搜索： webpack vue sass 路径图片