babel-plugin-inline-react-svg
babel-plugin-inline-react-svg copied to clipboard
airbnb
A babel plugin that optimizes and inlines SVGs for your React Components.
There is an examlpe of svg file: ``` ``` I expect that in html this file will look the same. But the viewBox attribute is lost in html. The code...
Hey, do you have any idea on how this plugin could support refs? Functional components don't support refs, so out of the box, it's not possible to simply write `...
Per title if I specify the SVGO option ``` [ "inline-react-svg", { "svgo": { "plugins": [ "cleanupIDs" ] } } ] ``` It breaks on line 78 in `src/index.js` ```...
Svgo has an option to pass the path to svg file to the `optimize` function https://github.com/svg/svgo#optimize It allows the `prefixIds` plugin to automatically prefix ids with a file name https://github.com/svg/svgo/blob/master/plugins/prefixIds.js#L194...
Hello, I'm trying to implement this plugin but it's failing on the following configuration: ```js { name: 'addAttributesToSVGElement', params: { attributes: [ { fill: 'currentColor', }, { 'aria-hidden': true, },...
Given a .babelrc like this ``` { "presets": ["next/babel"], "plugins": [ ["inline-react-svg", { "root": "./", "alias": { "svgs": "svgs" } }], ["module-resolver", { "root": ["./"], "alias": { "svgs": "svgs" }...
After upgrading I am getting the following error: ``` Property value of ObjectProperty expected node to be of a type ["Expression","PatternLike"] but instead got "JSXExpressionContainer" ``` I am using Next.js...
The React JSX transform detects JSX by seeing if it's already in the file, but it won't know about transformed JSX if the node visitors were never hit. https://github.com/babel/babel/blob/02fc9e835ceac71eb4de7dac6137fd0489176c29/packages/babel-helper-builder-react-jsx-experimental/src/index.js#L328 This...
For some reason this SVG: ```html ``` is being parsed to ```html ``` I'm importing and using like this: ```jsx import CheckboxIcon from "./CheckboxIcon.svg" ``` .babelrc: ```json { "presets": ["next/babel"],...
When importing an SVG, the [new JSX transform](https://reactjs.org/blog/2020/09/22/introducing-the-new-jsx-transform.html) doesn't work seamlessly along with React 17. The resulting component with inlined SVG data looks as follows: ```jsx var TextAroundImageEditor_IconFlip = function...
