Raw SVG с использованием raw-loader, продолжайте получать встроенный SVG

Я пытаюсь отобразить raw svg в компоненте Vue с помощью raw-loader. Тем не менее, svg всегда указывается независимо от того, что я делаю. Вот мой код:

<template>
    <div v-html="svg"></div>
</template>

<script>
import svg from 'raw-loader!@/assets/images/image.svg';
export default {
    data () {
        return {
              svg
        }
    }
};
</script>

Я понимаю это связано с vue-cli конфиг вебпака webpack.base.conf.js:

  {
    test: /\.(png|jpe?g|gif|svg)(\?.*)?$/,
    loader: 'url-loader',
    options: {
      limit: 10000,
      name: utils.assetsPath('img/[name].[hash:7].[ext]')
    }
  },

Я пытался добавить новое правило загрузчика для загрузки необработанных файлов, если я добавляю ?raw для них, но это тоже не работает:

  {
    test: /\.(png|jpe?g|gif|svg)(\?.*)?$/,
    loader: 'url-loader',
    options: {
      limit: 10000,
      name: utils.assetsPath('img/[name].[hash:7].[ext]')
    }
  },
  {
    test: /\.(png|jpe?g|gif|svg)(\?raw)$/,
    loader: 'raw-loader',
  },

Я использую:

  • vue-cli@2.9.2
  • vue@2.5.2

0 ответов

Другие вопросы по тегам