React Native SVG - (iOS) Invariant Violation: Native component for "RNSVGSvgView" does not exist

Question

I'm having an issue with the SVG library for React Native running on iOS simulator.

"dependencies": { 
     "better-fetch": "^1.1.2", 
     "firebase": "^4.8.1", 
     "lodash": "^4.17.4", 
     "react": "16.0.0", 
     "react-native": "0.51.0", 
     "react-native-svg": "^6.0.1-rc.1", 
     "react-redux": "^5.0.6", 
     "redux": "^3.7.2", 
     "redux-logger": "^3.0.6", 
     "redux-thunk": "^2.2.0" 
}

I have tried the following to no avail:

npm install react-native-svg --save //(again)
react-native link react-native-svg //(again)
watchman watch-del-all
rm -rf node_modules/ && yarn cache clean && yarn install

Answer 1

The image obviously shows that the problem is in the linking. As a result, If automatic linking does not work for you, it is possible to try manual linking. The guide for manual linking is missing for IOS devices; however, it is missing for IOS.

But you can follow the following steps for manual linking on IOS:

1. Open your project in XCode

2. go to .../node_modules/react-native-svg/ios

3. Locate and drag the file RNSVG.xcodeproj, into library directory shown in XCode.

4. Expand the file you just added (RNSVG.xcodeproj) until you see libRNSVG.a, it is located in RNSVG.xcodeproj > Products)

5. Drag libRNSVG.a into the Link Binary With Libraries section (located in Build Phases which may be found at the top of the XCode window)

Now you are good to go:)