A webpack loader that allows to use SVG files as Vue Components.
npm install --save-dev vue-svg-loader
yarn add --dev vue-svg-loader
{
test: /\.svg$/,
loader: 'vue-svg-loader', // `vue-svg` for webpack 1.x
options: {
// optional [svgo](https://github.com/svg/svgo) options
svgo: {
plugins: [
{removeDoctype: true},
{removeComments: true}
]
}
}
}<template>
<nav id="menu">
<a href="...">
<SomeIcon class="icon" />
Some page
</a>
</nav>
</template>
<script>
import SomeIcon from './assets/some-icon.svg';
export default {
name: 'menu',
components: {
SomeIcon,
},
};
</script>The idea behind this was inspired by react-svg-loader.
React
Typescript
Django
Laravel
Facebook
Microsoft
Google
Alibaba
D3
Tencent