参考文档:vite-svg-loader
安装与配置
安装插件
pnpm add vite-svg-loader -D
配置
// vite.config.ts
import svgLoader from 'vite-svg-loader'export default defineConfig({plugins: [vue(),svgLoader({defaultImport: 'component'})]
})
使用
<script setup lang="ts">
import Icon from 'images/icon.svg'
</script>
<template><component :is="Icon" /><!-- 或者 --><Icon />
</template>
<style lang="less" scoped>
.icon {width: 20px;height: 20px;fill: currentColor;color: blue;}</style>