以前在 Parcel v1 中，您可以只使用@svgr/parcel-plugin-svgrParcel 插件之类的东西。这将使您能够像使用 CRA 一样使用内联 SVG：
import Star from './star.svg'
const App = () => (
<div>
<Star />
</div>
)
任何人都可以帮助找出在 Parcel 2 中执行此操作的方法吗？
您如何使用 Parcel 2 在 React 中使用内联 SVG？
IT技术
reactjs
svg
parceljs
2021-05-27 11:42:32
1个回答
Parcel2 提供了@parcel/transformer-svg-react插件来实现这一点。
您需要执行以下操作：
安装它：
yarn add @parcel/transformer-svg-react --dev.parcelrc在项目的根目录添加一个文件，该文件定义使用此插件的命名管道：{ "extends": "@parcel/config-default", "transformers": { "jsx:*.svg": ["...", "@parcel/transformer-svg-react"] } }（
"..."条目实际上应该输入到.parcelrc文件中——它告诉parcel“像往常一样处理这些类型的资产，只有在你完成之后，才将它转换成一个react组件。”）在导入语句中使用命名管道：
import Star from 'jsx:./star.svg' const App = () => ( <div> <Star /> </div> )
请参阅parcel 2 文档。