在 react-native 上使用 react-native-svg 库时出错答案

【问题标题】：Error while using react-native-svg library on react-native在 react-native 上使用 react-native-svg 库时出错
【发布时间】：2018-03-05 18:46:23
【问题描述】：

我想用 svg 图片代替 png 图标，因为 png 渲染的图标质量不好。我有以下规范

"react-native": "^0.42.3",
"react-native-svg": "4.3.0",
"react": "^15.4.1"

在“npm install”之后，当我在我的项目中导入 react-native-svg 时，它会抛出以下错误

ERROR in ./node_modules/react-native-svg/lib/SvgTouchableMixin.js
Module not found: Error: Can't resolve 'react-native/Libraries/Components/Touchable/Touchable' in '/home/payalverma/Projects/caro-mobile/node_modules/react-native-svg/lib'
@ ./node_modules/react-native-svg/lib/SvgTouchableMixin.js 1:296-360
@ ./node_modules/react-native-svg/elements/Shape.js
@ ./node_modules/react-native-svg/elements/Rect.js
@ ./node_modules/react-native-svg/index.js
@ ./app/components/common/DrawerContent.js
@ ./app/components/Home.js
@ ./app/components/routes/Navigation.web.js
@ ./app/index.js
@ ./index.web.js
@ multi (webpack)-dev-server/client?http://0.0.0.0:5000 webpack/hot/dev-server ./index.web.js

任何人有类似的问题或可以帮助我解决同样的问题。是否需要安装任何缺少的依赖项？

【问题讨论】：

能否请您添加导入语句的代码。
我有一个名为 react-native-svg-uri(github.com/matc4/react-native-svg-uri ) 的库，它使用 react-native-svg 作为其依赖项。所以以下是我的导入代码： import SvgUri from 'react-native-svg-uri';它抛出上述错误
您是否按照文档所述在安装后运行react-native link react-native-svg？
是的。这个问题与我使用的版本有关吗？
我也使用了这个导入，它抛出了同样的错误：import Svg,{ Circle, Ellipse, G, LinearGradient, RadialGradient, Line, Path, Polygon, Polyline, Rect, Symbol, Use, Defs, Stop } from 'react-native-svg';

标签： reactjs react-native

【解决方案1】：

实际上 react-native-svg 并没有在依赖中包含 react-native-web。但是它包含在“/node_modules/react-native-svg/index.web.js”中。

只需运行此命令

npm i react-native-web

错误将被解决

【讨论】：

【解决方案2】：

你必须

yarn add react-native-web react-dom

根据这些文档 https://docs.expo.io/guides/running-in-the-browser/

【讨论】：