Agregué un paquete a un proyecto create-react-app que usa la plantilla mecanografiada. Estoy tratando de agregar svgs a mi archivo js generado siguiendo las recomendaciones de sus documentos . No estoy seguro de si hay algo que deba hacerse de manera diferente en TS, pero configuré mi proyecto como sugirieron como sus fragmentos JSX y no funcionó:

.parcelrc

 { "extends": "@parcel/config-default", "transformers": { "jsx:*.svg": ["...", "@parcel/transformer-svg-react"] } }

Nota: He agregado el complemento de transformador a mis departamentos de desarrollo.

Componente.tsx

 import BriefcaseSvg from "jsx:../../assets/briefcase.svg"; // ...later in my return statement: <img src={BriefcaseSvg} alt="work icon" /> // I've also tried <BriefcaseSvg/>

Cada vez que me sale el siguiente error:

Cannot resolve dependency 'jsx:../../assets/briefcase.svg'

También intenté convertir ambas declaraciones jsx a tsx .

Agregué un paquete además de la herramienta estándar de creación de paquetes web que obtiene con CRA. Wepback no tiene ningún problema y muestra el icono que acaba de encontrar. Parcel también pudo ejecutar una compilación cuando no incluí este complemento de svg, pero envié el svg por separado en su propio archivo.

Me gustaría que todo termine en un archivo js. ¿Cómo puedo lograr esto con paquete, reaccionar y TS?