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

[pascalrhmdi]

i used Expo, here my package.json:

"expo": "~40.0.0",
"react": "16.13.1",
 "react-native-svg": "12.1.0",
 "react-native-svg-transformer": "^0.14.3"

i just followed the tutorial but i got this.

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

here's my metro.config.js :

const { getDefaultConfig } = require('@expo/metro-config');

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

[tukaAlalami]

i am also have this issue any help ?

[aboozaid]

check if you restart metro before launching the app!

[angel-discover]

I was using require for the import, but you need to actually use import XX from YY from the looks of things.

[kbanashek]

you cant import inside of a module

[nysamnang]

I have the same issue, and here is how I resolve it:

1. Kill the terminal
2. Run react-native start --reset-cache
3. Run watchman watch-del-all && rm -rf /tmp/metro-bundler-cache-* && rm -rf /tmp/haste-map-react-native-packager-*
4. Re-run the project
5. Done!

Hope this can help!

[neetush]

@nysamnang Thanks!

[shllg]

Having the same issue and configured as described. Of course restarted everything. The import result will always be an empty object.

Reverting to 0.20.0 resolves the issue.