No component found for view with name "RNSVGCircle" #279

eemebarbe · 2017-03-11T03:45:10Z

On iOS, only using the example components from the repo. React v. 15.4.2, React-Native v. 0.42.0, and react-native-svg v. 5.1.5

(I did react-native link it)

import Svg, {     
    Circle,
    Ellipse,
    G,
    LinearGradient,
    RadialGradient,
    Line,
    Path,
    Polygon,
    Polyline,
    Rect,
    Symbol,
    Use,
    Defs,
    Stop } from 'react-native-svg';

class PieCircle extends Component{
    static title = 'Draw a Pie shape with circle';
    render() {
        return <Svg
            height="100"
            width="100"
        >
            <Circle
                cx="50"
                cy="50"
                r="40"
                fill="#ddd"
            />
            <Circle
                origin="50, 50"
                rotate="-90"
                cx="50"
                cy="50"
                r="20"
                stroke="#0074d9"
                strokeWidth="40"
                fill="none"
                strokeDasharray="80, 160"
            />
        </Svg>
    }
}

The text was updated successfully, but these errors were encountered:

mariobento · 2017-03-17T15:27:50Z

up

zuckeyM-17 · 2017-03-19T04:54:56Z

I have same problem.

*** caution!! *** this commit downgrade the react-native from v0.42.2 to v0.41.2, so that we use react-native-svg. TODO: if following issue is solved, we must upgrade react-native to latest version. - software-mansion/react-native-svg#279

vongohren · 2017-03-22T12:03:10Z

Any feedback from the creator on this?

ghost · 2017-03-30T13:43:57Z

Have the same problem. Did someone find a solution?

vongohren · 2017-03-30T16:41:32Z

@YanaKopyshchyk you have to upgrade this svg library. It has been recently released

mariobento · 2017-03-30T16:47:06Z

how recently @Snorlock ? using "react-native-svg": "^5.1.6" and having the same problem

vongohren · 2017-03-30T16:54:30Z

Following these issues:
#288
⬇️
#259
They say that it should be fixed in 5.1.6

But i see that im currently using master:
"react-native-svg": "github:react-native-community/react-native-svg#master",
And it works

mariobento · 2017-03-30T16:59:26Z

Damn, no luck using master as well! :S

ghost · 2017-03-31T09:05:41Z

@Snorlock I have the latest version 5.1.6, but, unfortunately, the problem is still there

vongohren · 2017-03-31T09:13:08Z

Thats weird, have you cleared derived data? Done a new pod install?
Im pretty sure atleast master works

ghost · 2017-03-31T13:25:41Z

I deleted node_modules and reinstalled everything, maybe something wrong with react-native link. @eemebarbe Have you solved this problem?
With react-native 0.42.3 works, but not with 0.41.2

vongohren · 2017-03-31T16:30:53Z

I never used react-native link.
Do you use cocoapods and swift?
Or either or, @YanaKopyshchyk?

ghost · 2017-03-31T17:28:40Z

I don't use cocoapods and swift. Anyway, I think the problem is in the mismatch of the versions :(

mariobento · 2017-04-10T14:59:16Z

@YanaKopyshchyk you solved the problem in any way?

ghost · 2017-04-10T15:26:35Z

@mariobento yes, but the problem was not with react-native-svg. I use react-native-maps and everything started working when I updated it to 0.13.0. ( Before the update everything worked except svg, but I had 'build failed' )

cmedinasoriano1 · 2017-05-14T04:30:52Z

I had this problem. I didn't remember that I used yarn to install react-native-svg and used brew (Homebrew) to install yarn, but then I updated yarn with brew by running in the terminal "brew upgrade yarn" and then ran "yarn upgrade" to save the new dependencies. After that, everything is working fine in yarn 0.24.4 and react-native-svg@5.1.8.

I really hope this helps anyone struggling as I did.

bendyorke · 2017-06-09T09:29:47Z

I'm running into this problem as well. Created a new project (react-native init), added react-native-svg, manually linked on iOS, reset the cache, cleared watchman, and tried all of the demos. Both the latest version (5.2.0 at time of writing) and master fail.

Has anyone come up with a solution?

dependencies:
react-native: 0.45.0
react: 16.0.0-alpha.12

PS:
It's not just RNSVGCircle that doesn't work - all of the named imports have their respective errors. However, just using <Svg /> in the codebase results in the following error in the console:

Warning: Native component for "RNSVGSvgView" does not exist

Andregreen · 2017-06-16T17:13:11Z

So the way I got around this problem was by individually importing in each component.
import Rect from 'react-native-svg';
import Svg from 'react-native-svg';
import Circle from 'react-native-svg';
etc...

elainen · 2017-06-20T16:17:56Z

I got the "No component found.." error as well.

I have:
react@16.0.0-alpha.12
react-native@0.45.1
react-native-svg@5.2.0

I tried linking and unlinking, reinstalling and restarting all the things. In my case, I noticed this error when running react-native run-ios:

2017-06-20 11:42:47.870 xcodebuild[60263:1870365] CFPropertyListCreateFromXMLData(): Old-style plist parser: missing semicolon in dictionary on line 1267. Parsing will be abandoned. Break on _CFPropertyListMissingSemicolon to debug.

2017-06-20 11:42:47.873 xcodebuild[60263:1870365] CFPropertyListCreateFromXMLData(): Old-style plist parser: missing semicolon in dictionary on line 1267. Parsing will be abandoned. Break on _CFPropertyListMissingSemicolon to debug.

2017-06-20 11:42:47.874 xcodebuild[60263:1870365] Error Domain=NSCocoaErrorDomain Code=3840 "Unexpected character / at line 1" UserInfo={NSDebugDescription=Unexpected character / at line 1, kCFPropertyListOldStyleParsingError=Error Domain=NSCocoaErrorDomain Code=3840 "Missing ';' on line 1267" UserInfo={NSDebugDescription=Missing ';' on line 1267}}

and in line 1267 in my project.pbxproj I saw:

HEADER_SEARCH_PATHS = "$(SRCROOT)/../node_modules/react-native-navigation/ios/**""$(SRCROOT)/../node_modules/react-native-svg/ios/**";

so I changed it to:

HEADER_SEARCH_PATHS = (
  "$(SRCROOT)/../node_modules/react-native-navigation/ios/**",
  "$(SRCROOT)/../node_modules/react-native-svg/ios/**",
);

Not exactly sure how that happened but it ended up working for me.

bendyorke · 2017-06-21T17:08:18Z

What eventually worked for me was building and running with Xcode (pressing play in Xcode vs react-native run-ios). After doing that once, react-native run-ios started working. :)

oliviachang29 · 2017-06-27T01:33:01Z

Tried Andregreen's method, but I just get a red rectangle.

Xcode build keeps failing, so bendyorke's suggestion isn't working at the moment. ;(

Any other suggestions?

"react": "16.0.0-alpha.12",
"react-native": "0.45.1",
"react-native-svg": "^5.2.0",

alanbo · 2017-06-27T18:37:21Z

Same for me "No component found for view with name "RNSVGCircle". Andregreen fix outputs only red rectangles. Building in xcode fails with the error: "ld: library not found for -lRNSVG-tvOS
clang: error: linker command failed with exit code 1 (use -v to see invocation)"

alanbo · 2017-06-27T19:11:00Z

I run svg example on iOS simulator with Expo and it works fine: https://docs.expo.io/versions/v18.0.0/sdk/svg.html

alanbo · 2017-07-04T18:13:33Z

For me this solves the problem #387 . Remove “libRNSVG-tvOS.a” in xcode and restart the project. Svg will work just fine.

mikedavies-dev · 2017-09-19T09:21:29Z

I resolved this issue by adding RNSVG into my pod file and rebuilding:

pod 'RNSVG', :path => '../node_modules/react-native-svg'

then
pod install

dwilt · 2018-01-19T00:03:16Z

I ran into this about a month ago and am really sad to see this is still outstanding. I haven't figured out a way to get around it.

"react-native": "0.52.0",
"react-native-svg": "^6.0.1-rc.2",

Tried a lot of the suggestions here but to no avail. Per @alanbo - libRNSVG-tvOS.a wasn't even in my project. After the react-native link ran, I didnt' have any changes to my project.pbxproj file. Per @ant-fx - that line was added already for me from react-native link.

msand · 2018-01-19T18:12:59Z

@dwilt Have you tried to run e.g. https://github.com/magicismight/react-native-svg-example or https://github.com/msand/SVGPodTest if you want cocoapods?

dwilt · 2018-01-19T18:24:26Z

@msand No, I haven't tried either of those. Regarding the cocoapods, I don't need that if I do the react-native link way of installing, correct? The readme seems to indicate that the CocoaPods are only used if you install manually.

msand · 2018-01-19T22:36:26Z

True, was thinking it might be good to eliminate some variables, by trying to build and run and known to work repo. Cocoapods is only needed if you want that to handle configuring your native dependencies for your xcode project, e.g. if you want fbsdk installed in a CI compatible way etc.

dwilt · 2018-01-20T01:47:25Z

So, I'm sure that repo works but it's also a RN version behind (it's last commit was 2 months ago). Are you saying I should try to install the CocoaPods and go from there?

msand · 2018-01-20T01:56:01Z

Either that, or you can checkout a few commits earlier: msand/SVGPodTest@4e36ccd
Before the cocoapods integration.

msand · 2018-01-20T01:58:12Z

Or, just do the steps I did:
react-native init SVGTest
cd SVGTest
yarn add react-native-svg
react-native link react-native-svg

Remove libRNSVG-tvOS.a manually using xcode.
Build and run.

msand · 2018-02-13T21:30:42Z

This should work if following the linking instructions. Closing for now.

tandemloop · 2018-12-18T23:11:39Z

Didn't work.

zuckeyM-17 mentioned this issue Mar 19, 2017

using react-native-svg phlocs201/react_native_optical_illusion#1

Merged

Torgian mentioned this issue Jun 24, 2017

No component found for view with name "RNSVGRect" : latest version used, no peer dependency errors #382

Closed

Katherine-Marschner mentioned this issue Jul 10, 2017

ld: library not found for -lRNSVG-tvOS #387

Closed

msand closed this as completed Feb 13, 2018

Provide feedback

Saved searches

Use saved searches to filter your results more quickly

No component found for view with name "RNSVGCircle" #279

No component found for view with name "RNSVGCircle" #279

eemebarbe commented Mar 11, 2017 •

edited

Loading

mariobento commented Mar 17, 2017

zuckeyM-17 commented Mar 19, 2017

vongohren commented Mar 22, 2017

ghost commented Mar 30, 2017

vongohren commented Mar 30, 2017 •

edited

Loading

mariobento commented Mar 30, 2017

vongohren commented Mar 30, 2017

mariobento commented Mar 30, 2017

ghost commented Mar 31, 2017

vongohren commented Mar 31, 2017

ghost commented Mar 31, 2017 •

edited by ghost

Loading

vongohren commented Mar 31, 2017

ghost commented Mar 31, 2017 •

edited by ghost

Loading

mariobento commented Apr 10, 2017

ghost commented Apr 10, 2017 •

edited by ghost

Loading

cmedinasoriano1 commented May 14, 2017

bendyorke commented Jun 9, 2017 •

edited

Loading

Andregreen commented Jun 16, 2017

elainen commented Jun 20, 2017 •

edited

Loading

bendyorke commented Jun 21, 2017

oliviachang29 commented Jun 27, 2017 •

edited

Loading

alanbo commented Jun 27, 2017

alanbo commented Jun 27, 2017

alanbo commented Jul 4, 2017

mikedavies-dev commented Sep 19, 2017

dwilt commented Jan 19, 2018

msand commented Jan 19, 2018

dwilt commented Jan 19, 2018

msand commented Jan 19, 2018

dwilt commented Jan 20, 2018

msand commented Jan 20, 2018 •

edited

Loading

msand commented Jan 20, 2018 •

edited

Loading

msand commented Feb 13, 2018

tandemloop commented Dec 18, 2018

No component found for view with name "RNSVGCircle" #279

No component found for view with name "RNSVGCircle" #279

Comments

eemebarbe commented Mar 11, 2017 • edited Loading

mariobento commented Mar 17, 2017

zuckeyM-17 commented Mar 19, 2017

vongohren commented Mar 22, 2017

ghost commented Mar 30, 2017

vongohren commented Mar 30, 2017 • edited Loading

mariobento commented Mar 30, 2017

vongohren commented Mar 30, 2017

mariobento commented Mar 30, 2017

ghost commented Mar 31, 2017

vongohren commented Mar 31, 2017

ghost commented Mar 31, 2017 • edited by ghost Loading

vongohren commented Mar 31, 2017

ghost commented Mar 31, 2017 • edited by ghost Loading

mariobento commented Apr 10, 2017

ghost commented Apr 10, 2017 • edited by ghost Loading

cmedinasoriano1 commented May 14, 2017

bendyorke commented Jun 9, 2017 • edited Loading

Andregreen commented Jun 16, 2017

elainen commented Jun 20, 2017 • edited Loading

bendyorke commented Jun 21, 2017

oliviachang29 commented Jun 27, 2017 • edited Loading

alanbo commented Jun 27, 2017

alanbo commented Jun 27, 2017

alanbo commented Jul 4, 2017

mikedavies-dev commented Sep 19, 2017

dwilt commented Jan 19, 2018

msand commented Jan 19, 2018

dwilt commented Jan 19, 2018

msand commented Jan 19, 2018

dwilt commented Jan 20, 2018

msand commented Jan 20, 2018 • edited Loading

msand commented Jan 20, 2018 • edited Loading

msand commented Feb 13, 2018

tandemloop commented Dec 18, 2018

eemebarbe commented Mar 11, 2017 •

edited

Loading

vongohren commented Mar 30, 2017 •

edited

Loading

ghost commented Mar 31, 2017 •

edited by ghost

Loading

ghost commented Mar 31, 2017 •

edited by ghost

Loading

ghost commented Apr 10, 2017 •

edited by ghost

Loading

bendyorke commented Jun 9, 2017 •

edited

Loading

elainen commented Jun 20, 2017 •

edited

Loading

oliviachang29 commented Jun 27, 2017 •

edited

Loading

msand commented Jan 20, 2018 •

edited

Loading

msand commented Jan 20, 2018 •

edited

Loading