在 vite react 项目中集成 svgo？

Question

create-react-app 中有一个很有用的特性就是 svgo，它允许你像使用组件一样使用 svg：

import { ReactComponent as NotFound } from '@/assets/images/not-found.svg'

function Error() {
  return (
    <div>
      <NotFound className="logo" />
    </div>
  )
}
export default Error

有没有办法在 vite 中这样用？

Answer 1

cra 这个特性 是通过 @svgr/webpack loader 实现的。
vite的话，可以考虑使用这个插件实现：vite-plugin-svgr