Question

我只是按照教程进行操作，并遇到了这个错误。

我所拥有的只是

package.json

"dependencies": {
    "@react-native-community/masked-view": "^0.1.10",
    "@react-navigation/native": "^5.7.4",
    "@react-navigation/stack": "^5.9.1",
    "react": "16.13.1",
    "react-native": "0.63.2",
    "react-native-gesture-handler": "^1.8.0",
    "react-native-reanimated": "^1.13.0",
    "react-native-safe-area-context": "^3.1.8",
    "react-native-screens": "^2.11.0",
    "react-native-svg": "^12.1.0",
    "react-native-svg-transformer": "^0.14.3"
  },

login.js

import React, {Component} from 'react';
import {Text, View} from 'react-native';
import Logo from '../assets/images/logo-white.svg';

class Login extends Component {
  render() {
    return (
      <View
        style={{
          flex: 1,
          justifyContent: 'center',
          alignItems: 'center',
        }}>
        <Logo />
        <Text>Hello, world!</Text>
      </View>
    );
  }
}

export default Login;

我得到的错误是这个。而且我不知道为什么会到来以及它出了什么问题。

Error: Element type is invalid: expected a string (for built-in components) or a class/function (for composite components) but got: number.

Check the render method of `Login`.

This error is located at:
    in RCTView (at View.js:34)
    in View (at login.js:8)
    in Login (at SceneView.tsx:122)
    in StaticContainer
    in StaticContainer (at SceneView.tsx:115)
...
...

尝试了所有内容，但无法解决。我没有使用EXPO。有人可以帮助我。

Answer 1

在项目的根目录中更改您的metro.config.js，如下所示，然后关闭终端并再次运行应用程序

const { getDefaultConfig } = require("metro-config");
 

    module.exports = (async () => {
      const {
        resolver: { sourceExts, assetExts } 
      } = await getDefaultConfig();
      return {
        transformer: {
          getTransformOptions: async () => ({
                   transform: {
                     experimentalImportSupport: false,
                     inlineRequires: false,
                   },
                 }),
          babelTransformerPath: require.resolve("react-native-svg-transformer")
        },
        resolver: {
          assetExts: assetExts.filter(ext => ext !== "svg"),
          sourceExts: [...sourceExts, "svg"]
        }
      };
    })();

尝试使用SVG图片时元素类型无效

1 个答案: