I am trying to import SVG as react component based on the documentation from parcel site. Instead of the svg being rendered as a component in the page, the build actually fails. With an error - @parcel/core: No transformers found for src/assets/logo.jsx with pipeline: 'jsx'.
Using default babel configuration.
// package.json
{
"name": "parcel-react-app",
"version": "1.0.0",
"description": "",
"main": "index.js",
"scripts": {
"start": "parcel src/index.html"
},
"keywords": [],
"author": "",
"license": "ISC",
"devDependencies": {
"@parcel/transformer-svg-react": "^2.2.1",
"parcel": "^2.2.1"
},
"dependencies": {
"react": "^17.0.2",
"react-dom": "^17.0.2"
}
}
// .parcelrc
{
"extends": "@parcel/config-default",
"transformers": {
"jsx:*.svg": ["...", "@parcel/transformer-svg-react"]
}
}
The svg image should be loaded as a react component in the webpage.
An error is thrown saying @parcel/core: No transformers found for src/assets/logo.jsx with pipeline: 'jsx'.
I am trying to import a svg image as a react component.
Clone this repo and run yarn && yarn run dev
Software | Version(s) |
---|---|
Parcel | 2.2.0 |
Node | 16.13.2 |
npm/Yarn | 8.1.2 / 1.22.17 |
Operating System | Windows 10 |