Comments (7)
msand
commented on May 27, 2024
1
I mean v0.61.0
from react-native-svg-transformer.
kristerkari
commented on May 27, 2024
@msand do you have any idea about this one?
from react-native-svg-transformer.
msand
commented on May 27, 2024
What versions of react-native and react-native-svg is this? Can you try v9.10.0?
from react-native-svg-transformer.
msand
commented on May 27, 2024
The useNativeDriver issue should by fixed by a pr i made which is included in v0.60.0 and later
from react-native-svg-transformer.
andrewtremblay-pear
commented on May 27, 2024
Currently on "react-native": "0.59.10" and "react-native-svg": "9.8.3", will try to repro in more recent versions.
Still no clear idea as to the cause but there might be an issue with animating rgba colors against hexadecimal values.
from react-native-svg-transformer.
andrewtremblay-pear
commented on May 27, 2024
Still seeing the warning in RN 0.61.5
Listing relevant versions:
"react": "^16.9.0",
"react-native": "0.61.5",
"react-native-svg": "10.1.0",
"@svgr/plugin-svgo": "^4.3.1",
"react-native-svg-transformer": "^0.14.3",
from react-native-svg-transformer.
sypl
commented on May 27, 2024
I was getting this error, trying to replace "@fill". For some reason the space before the closing tag is important.
This works:
<svg width="24" height="24" viewBox="0 0 24 24" fill="none" xmlns="http://www.w3.org/2000/svg">
<path fill-rule="evenodd" clip-rule="evenodd" d="M21.4853 12C21.4853 12.5523 21.0376 13 20.4853 13H3.51472C2.96243 13 2.51472 12.5523 2.51472 12C2.51472 11.4477 2.96243 11 3.51472 11H20.4853C21.0376 11 21.4853 11.4477 21.4853 12Z" fill="@fill" />
<path fill-rule="evenodd" clip-rule="evenodd" d="M12 2.51471C12.5523 2.51471 13 2.96242 13 3.51471L13 20.4853C13 21.0376 12.5523 21.4853 12 21.4853C11.4477 21.4853 11 21.0376 11 20.4853L11 3.51471C11 2.96242 11.4477 2.51471 12 2.51471Z" fill="@fill"/>
</svg>
This doesn't (throws warning "@fill" is not a valid color or brush:
<svg width="24" height="24" viewBox="0 0 24 24" fill="none" xmlns="http://www.w3.org/2000/svg">
<path fill-rule="evenodd" clip-rule="evenodd" d="M21.4853 12C21.4853 12.5523 21.0376 13 20.4853 13H3.51472C2.96243 13 2.51472 12.5523 2.51472 12C2.51472 11.4477 2.96243 11 3.51472 11H20.4853C21.0376 11 21.4853 11.4477 21.4853 12Z" fill="@fill" />
<path fill-rule="evenodd" clip-rule="evenodd" d="M12 2.51471C12.5523 2.51471 13 2.96242 13 3.51471L13 20.4853C13 21.0376 12.5523 21.4853 12 21.4853C11.4477 21.4853 11 21.0376 11 20.4853L11 3.51471C11 2.96242 11.4477 2.51471 12 2.51471Z" fill="@fill"/>
</svg>
Can you spot the difference? It's the end of line 2:
Good:
fill="@fill" />
Bad:
fill="@fill"/>
Even weirder is that it doesn't cause a problem on line three, which ends:
fill="@fill"/>
from react-native-svg-transformer.
Related Issues (20)
- how to configure metro.config.js in 0.72.0 HOT 18
- After install package react-native-svg-transformer unable to run project HOT 1
- Identifier 'Svg' has already been declared HOT 6
- Import local svg without extension
- TypeError: Cannot read properties of undefined (reading 'has') HOT 2
- svg does not display properly when used with styled-components HOT 2
- Could we add support for optional import svg as a string not a `SvgComponent`? HOT 1
- Fails to find react-native-babel-transformer when used with React Native 0.73 because the package has been renamed HOT 4
- RN 0.73 compatibility HOT 1
- metro-react-native-babel-transformer needs to be replaced in RN 0.73 HOT 11
- Latest Expo SDK 50 beta adds new upstream transformer, causing bundle failure HOT 1
- EXPO RN Cannot display SVG, issue with RNSVGPath
- Expo SDK 50 crashes when apply metro config HOT 2
- Expo SDK 50 - cannot read properties of undefined (reading 'cacheable') HOT 2
- Unexpected import of expo metro config HOT 4
- missing-asset-registry-path HOT 1
- React native svg transformer does not color svg using replaceAttrValues HOT 4
- Expo 50 Solution
- Unable to resolve 'path' in @svgr/core HOT 2
- metro.config.js 配置多个 babelTransformerPath
Recommend Projects
-
React
A declarative, efficient, and flexible JavaScript library for building user interfaces.
-
Vue.js
🖖 Vue.js is a progressive, incrementally-adoptable JavaScript framework for building UI on the web.
-
Typescript
TypeScript is a superset of JavaScript that compiles to clean JavaScript output.
-
TensorFlow
An Open Source Machine Learning Framework for Everyone
-
Django
The Web framework for perfectionists with deadlines.
-
Laravel
A PHP framework for web artisans
-
D3
Bring data to life with SVG, Canvas and HTML. 📊📈🎉
-
Recommend Topics
-
javascript
JavaScript (JS) is a lightweight interpreted programming language with first-class functions.
-
web
Some thing interesting about web. New door for the world.
-
server
A server is a program made to process requests and deliver data to clients.
-
Machine learning
Machine learning is a way of modeling and interpreting data that allows a piece of software to respond intelligently.
-
Visualization
Some thing interesting about visualization, use data art
-
Game
Some thing interesting about game, make everyone happy.
Recommend Org
-
Facebook
We are working to build community through open source technology. NB: members must have two-factor auth.
-
Microsoft
Open source projects and samples from Microsoft.
-
Google
Google ❤️ Open Source for everyone.
-
Alibaba
Alibaba Open Source for everyone
-
D3
Data-Driven Documents codes.
-
Tencent
China tencent open source team.
from react-native-svg-transformer.