Question 32775 in React native Question posted in
The official React Native documentation can be found here.

Using LinearGradient for web gives error export 'requireNativeComponent' (imported as 'requireNativeComponent') was not found – React native

I use React Native component LinearGradient for a web project.

<LinearGradient colors={['rgba(0,0,0,0.7)', 'rgba(0,0,0,0)']}>
   <View />
</LinearGradient>

This produces the error

Using LinearGradient for web gives error export 'requireNativeComponent' (imported as 'requireNativeComponent') was not found in 'react-native-web/dist/index'

What could be the issue and how to fix it?

Tags:

2

Answers


  1. Chosen as BEST ANSWER
    0

    It seems that the issue is React Native component <LinearGradient /> does not work for the web. One of the solutions is to use <WebLinearGradient> instead:

    <WebLinearGradient colors={['rgba(0,0,0,0.7)', 'rgba(0,0,0,0)']}>
   <View />
</WebLinearGradient>

    The more dynamic and universal solution could be like this:

    import { Platform } from 'react-native';
import LinearGradient from 'react-native-linear-gradient';
import WebLinearGradient from 'react-native-web-linear-gradient';

const MyGradient = Platform.OS === 'web' ? WebLinearGradient : LinearGradient;

// Use MyGradient in your component

  2. 0

    Linear Gradient is one of the property of React Native and react native is only a mobile application development platform . If incase you want to use gradient colors for website means you have to set background color to parent component like this ,

    .grad {
      background-image: linear-gradient(red, yellow);
      }
    <div class="grad"> parent>
   <div> child</div>
</div>
    Login or Signup to reply.
Please signup or login to give your own answer.

Back To Top
Search