expo linearGradient not working correctly

Question

Problem:

I have created a react-native application. There are I am using a linear gradient.

This is my code.

import React, { Component } from "react";

import {
  StyleSheet,
  KeyboardAvoidingView,
  View,
  ActivityIndicator,
  TouchableOpacity,
  TextInput,
  Text,
  Image,
  ImageBackground
} from "react-native";

import { LinearGradient } from "expo";

class Login extends Component {
  render() {
    return (
      <View style={styles.container}>
        <View style={styles.loginHeader}>
          <LinearGradient colors={["#fdc830", "#ff9a00"]} style={{ flex: 1 }}>
            <Image
              source={require("../../../assets/logo-02.png")}
              style={styles.image}
            />
          </LinearGradient>
        </View>
        <Text>Login</Text>
      </View>
    );
  }
}

export default Login;

const styles = StyleSheet.create({
  container: {
    top: 0,
    flex: 3,
    alignItems: "center"
  },
  loginHeader: {},
  image: {}
});

The error which I was facing is

Invarient Violation:Element type is invalid: expected a string (for built-in-components) or a class/function (for composite components) but got:undefined. you likely forgot to export your component from the file it's defined in, or you might have mixed up default and named imports

I tried a lot to find a solution to this problem but I was unable to do so. Can you help me to find a solution to this problem It would be great? Thank you.

Answer 1

if you are using expo:34,35: Add the package expo-linear-gradient and modify import to

import { LinearGradient } from 'expo-linear-gradient'