未找到 react-native-svg ForeignObject 元素（React-Native + Expo + TypeScript）

Question

我有一个用 Expo 创建的 React Native 项目。我还使用了 expo TypeScript 配置。

我使用 "expo install." 安装了 react-native-svg 我目前安装了 9.13.3 版本。

每当我尝试使用 react-native-svg 渲染 SVG 时，我都会收到此错误。

我查看了节点模块的 src 文件，但找不到 ForeignObject 元素的任何文件。

错误：

Unable to resolve module `./elements/ForeignObject` from `node_modules/react-native-svg/src/ReactNativeSVG.ts`: 

None of these files exist:
  * node_modules/react-native-svg/src/elements/ForeignObject(.native|.ios.expo.ts|.native.expo.ts|.expo.ts|.ios.expo.tsx|.native.expo.tsx|.expo.tsx|.ios.expo.js|.native.expo.js|.expo.js|.ios.expo.jsx|.native.expo.jsx|.expo.jsx|.ios.ts|.native.ts|.ts|.ios.tsx|.native.tsx|.tsx|.ios.js|.native.js|.js|.ios.jsx|.native.jsx|.jsx|.ios.json|.native.json|.json|.ios.wasm|.native.wasm|.wasm)
  * node_modules/react-native-svg/src/elements/ForeignObject/index(.native|.ios.expo.ts|.native.expo.ts|.expo.ts|.ios.expo.tsx|.native.expo.tsx|.expo.tsx|.ios.expo.js|.native.expo.js|.expo.js|.ios.expo.jsx|.native.expo.jsx|.expo.jsx|.ios.ts|.native.ts|.ts|.ios.tsx|.native.tsx|.tsx|.ios.js|.native.js|.js|.ios.jsx|.native.jsx|.jsx|.ios.json|.native.json|.json|.ios.wasm|.native.wasm|.wasm)

ABI36_0_0facebook::ABI36_0_0React::JSIExecutor::defaultTimeoutInvoker(std::__1::function<void ()> const&, std::__1::function<std::__1::basic_string<char, std::__1::char_traits<char>, std::__1::allocator<char> > ()>)
ABI36_0_0facebook::ABI36_0_0React::JSIExecutor::defaultTimeoutInvoker(std::__1::function<void ()> const&, std::__1::function<std::__1::basic_string<char, std::__1::char_traits<char>, std::__1::allocator<char> > ()>)
B9D95EAB-9269-367D-B2F4-C2B45821A32D
B9D95EAB-9269-367D-B2F4-C2B45821A32D
B9D95EAB-9269-367D-B2F4-C2B45821A32D
7519E999-1053-3367-B9D5-8844F6D3BDC6
7519E999-1053-3367-B9D5-8844F6D3BDC6
CFRunLoopRunSpecific
GSEventRunModal
UIApplicationMain
Exponent
7B531A15-3E73-3185-90E2-B88D9476DA5E

这是我的组件声明 - Star.tsx:

import * as React from "react";
import { Svg, Defs, Path } from "react-native-svg";

class StarIcon extends React.Component<{}, {}> {

  render() {
    return (
      <Svg width={31.709} height={31.814} viewBox="0 0 31.709 31.814" fill="black">
        <Defs />
        <Path
          d="M15.5,23.7,23.843,29l-2.214-9.99L29,12.288l-9.707-.867L15.5,2l-3.793,9.422L2,12.288,9.371,19.01,7.157,29Z"
          transform="translate(0.355 0.677)"
        />
      </Svg>
    )
  }
};

export default StarIcon;

我不确定是什么问题，除了它可能与 TypeScript 配置有关。我在 JavaScript react-native 项目中创建了相同的图标，它运行良好。

如果有人知道我为什么会收到此错误或可以提供任何帮助，我将不胜感激！

谢谢。

Answer 1

好吧...原来我只需要清理我的 npm 缓存...

expo r -c

oof

未找到 react-native-svg ForeignObject 元素（React-Native + Expo + TypeScript）

react-native-svg ForeignObject element not found (React-Native + Expo + TypeScript)

javascript

typescript

react-native

expo

react-native-svg