packages/webpack-preset-accurapp/customBlocks.js
function reactSvgLoader() {
  return (context, { addLoader }) =>
    addLoader({
      test: /\.svg$/,
      issuer: {
        test: /\.(js|jsx|ts|tsx)$/,
      },
      use: [
        // TODO this is probably not needed
        // {
        //   loader: 'babel-loader',
        //   options: babelLoaderOptions,
        // },
        {
          loader: '@svgr/webpack',
          options: {
            svgProps: {
              fill: 'currentColor',
            },
            titleProp: true,
            svgoConfig: {
              multipass: true,
              pretty: process.env.NODE_ENV === 'development',
              indent: 2,
              plugins: [
                { sortAttrs: true },
                { removeViewBox: false },
                { removeDimensions: true },
                { convertColors: { currentColor: true } },
                { cleanupIDs: { minify: false } },
              ],
            },
          },
        },
        {
          loader: 'url-loader',
          options: {
            limit: 10000,
            name: fileNameTemplate,
          },
        },
      ],
    })
}
function reactSvgLoader() {
  return (context, { addLoader }) =>
    addLoader({
      test: /\.svg$/,
      issuer: {
        test: /\.(js|jsx|ts|tsx)$/,
      },
      use: [
        // TODO this is probably not needed
        // {
        //   loader: 'babel-loader',
        //   options: babelLoaderOptions,
        // },
        {
          loader: '@svgr/webpack',
          options: {
            svgProps: {
              fill: 'currentColor',
            },
            titleProp: true,
            svgoConfig: {
              multipass: true,
              pretty: process.env.NODE_ENV === 'development',
              indent: 2,
              plugins: [
                { sortAttrs: true },
                { removeViewBox: false },
                { removeDimensions: true },
                { convertColors: { currentColor: true } },
                { cleanupIDs: { minify: false } },
              ],
            },
          },
        },
        {
          loader: 'url-loader',
          options: {
            limit: 10000,
            name: fileNameTemplate,
          },
        },
      ],
    })
}
function reactSvgLoader ( ) { return ( context , { addLoader } ) => addLoader ( { test : / \.svg$ / , issuer : { test : / \.(js|jsx|ts|tsx)$ / , } , use : [ // TODO this is probably not needed // { //   loader: 'babel-loader', //   options: babelLoaderOptions, // }, { loader : '@svgr/webpack' , options : { svgProps : { fill : 'currentColor' , } , titleProp : true , svgoConfig : { multipass : true , pretty : process . env . NODE_ENV === 'development' , indent : 2 , plugins : [ { sortAttrs : true } , { removeViewBox : false } , { removeDimensions : true } , { convertColors : { currentColor : true } } , { cleanupIDs : { minify : false } } , ] , } , } , } , { loader : 'url-loader' , options : { limit : 10000 , name : fileNameTemplate , } , } , ] , } ) }
Allows you to use two kinds of imports for SVG: import logoUrl from './logo.svg'; gives you the URL. import { ReactComponent as Logo } from './logo.svg'; gives you a component.
Allows you to use two kinds of imports for SVG : import logoUrl from . / logo . svg ; gives you the URL . import { ReactComponent as Logo } from . / logo . svg ; gives you a component .