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