webpack如何处理vue单文件组件中的style标签中的图片，打包完之后发现图片根本没有打包.只打包了css

Question

问题描述

webpack如何处理vue单文件组件中的style标签中的图片，因为用到了样式抽离，打包完之后发现图片根本没有打包.原样输出在dist目录里面，打包完之后应该会有按照我指定的hash值生成图片名称，只打包了style标签中的css
图片处理的打包loader:
{
test: /.(png|jpe?g|gif|svg)$/,
use: {

loader: 'url-loader',
options: {
    limit: 10000,
    name: 'images/[name].[hash:7].[ext]'
}

}
}
下面是打包的文件：
star.vue:
<template>

<h1>hello world!3344</h1>

</template>
<script>
export default {

}
</script>
<style scoped>
h1 {

   width: 100px;
   transform: rotateX(30deg);
   /* animation: animate ease 1s; */
   background: url('/images/demoImage.jpg') no-repeat;

}
</style>
打包后：
h1[data-v-1d1bee34] {

   width: 100px;
   transform: rotateX(30deg);
   /* animation: animate ease 1s; */
   background: url('/images/demoImage.jpg') no-repeat;

}
body {

margin: 0;
/* background: url('../images/demoImage.jpg') no-repeat; */

}
backgound里面的图片没有发生任何变化，图片也没有生成。

Answer 1

什么叫 图片根本没有打包?经过 webpack 处理的化，有可能是以 base64 方式内嵌在 css 里了