jueves, 5 de noviembre de 2020

Exporting TS React components handling SVGs in a NPM package to be consumed potentially by CRA

Use the same SVG module definition as CRA: https://github.com/facebook/create-react-app/blob/master/packages/react-scripts/lib/react-app.d.ts#L47


declare module '*.svg' {

  import * as React from 'react';

  export const ReactComponent: React.FunctionComponent<React.SVGProps<

    SVGSVGElement

  > & { title?: string }>;

  const src: string;

  export default src;

}


Use both @svgr/webpack and url-loader together in webpack config:

{
  test: /\.svg$/,
  use: ['@svgr/webpack', 'url-loader'], 
} 



No hay comentarios: