如何在vue中使用raw-loader，在scss中使用文件加载器？

Question

我想让webpack在vue html模板和scss中加载不同的文件。

<template>
  <!-- I want here to load it as inline svg -->
  <div v-html="require('./file.svg').default"></div>
</template>

<style lang="scss">
  .class {
    // but here I wan't to just get rewrite url to loaded file
    background: url('../file.svg'); 
  }
</style>

我在webpack中有这个配置，它同时适用于scss和vue文件。

rules: [
  {
     test: /\.svg$/i,
     loader: 'file-loader'
  }
]

Answer 1

我不能解决这个问题，所以我找到了丑陋的变通方法。我保留了所有的文件加载器，但在Vue html模板中，我直接指定使用raw-loader

<template>
  <div v-html="require('!raw-loader!./file.svg').default"></div>
</template>