question-mark
Stuck on an issue?

Lightrun Answers was designed to reduce the constant googling that comes with debugging 3rd party libraries. It collects links to all the places you might be looking at while hunting down a tough bug.

And, if you’re still stuck at the end, we’re happy to hop on a call to see how we can help out.

Have the ability to set SVGR built-in configuration

See original GitHub issue

Question

How can I configure the SVGR built-in?

My current loader looks like this:

test: /\.svg$/,
use: {
  loader: '@svgr/webpack',
  options: {
    icon: true,
    replaceAttrValues: {
      '#1a171b': 'currentColor'
    }
  }
}

Issue Analytics

  • State:closed
  • Created 5 years ago
  • Comments:10 (3 by maintainers)

github_iconTop GitHub Comments

1reaction
pedronauckcommented, Nov 5, 2018

Hi @danielbayerlein, that’s is something that we need to put on doczrc. I’ll do that and put for the last release 🙏

1reaction
lasimonnecommented, Oct 10, 2018

You can use the modifyBundlerConfig

// doczrc.js
export default {
  modifyBundlerConfig: (config) => {
    /* custom loaders */
    config.module.rules.push({
        test: /\.svg$/,
        use: '@svgr/webpack',
    });
    return config
  }
}
Read more comments on GitHub >

github_iconTop Results From Across the Web

Options - SVGR
Options · Config file · Runtime config · JSX runtime · JSX runtime import source · Icon · Native · TypeScript · Dimensions....
Read more >
Try to test component with React generated form svgr · Issue #83
Hi, I have a little problem with Jest tests runner. My simple component: import React from 'react'; import {ReactComponent as CloseIcon} ...
Read more >
Pass options to the builtin svgo from svgr/webpack
In my case I got errors that: plugins should be an array;; Each plugin object requires a name property. So here is what...
Read more >
How To Import SVGs into NextJS | Frontend Digest
1. Use SVGR ... SVGR is a tool that allows us to import SVGs into your React applications as React components. If you...
Read more >
SVG Components in React - YouTube
SVG is great as you get to scale it without loss of quality. In this lesson we look at various ways you can...
Read more >

github_iconTop Related Medium Post

No results found

github_iconTop Related StackOverflow Question

No results found

github_iconTroubleshoot Live Code

Lightrun enables developers to add logs, metrics and snapshots to live code - no restarts or redeploys required.
Start Free

github_iconTop Related Reddit Thread

No results found

github_iconTop Related Hackernoon Post

No results found

github_iconTop Related Tweet

No results found

github_iconTop Related Dev.to Post

No results found

github_iconTop Related Hashnode Post

No results found