Нарушение инварианта: просмотр конфигурации не найден для имени Home

Question

Во время практики навигации в проекте React Native я обнаружил ошибку, представленную на снимке экрана ниже:

Инвариантное нарушение: просмотр конфигурации не найден для имени Home.Эта ошибка находится по адресу: in Home (atSceneView.js: 10)

Полная информация об ошибке представлена ​​на скриншоте:

Из чего ячитай, такая ошибка появляется при именовании компонентов строчными буквами, но в моем случае она названа правильно.

Вот мой код файла Home.js:

import React, { Component } from 'react';
import { Platform, StyleSheet, Text, View, Button } from 'react-native';
import firebase from 'firebase';
import Header from './Header';
import LogoutButton from './LogoutButton';
import AlbumList from './AlbumList';
import ALbumDetails from './AlbumDetails';
import LoginForm from './LoginForm';
import { StackNavigator } from 'react-navigation';

export default class Home extends Component {
  static navigationOptions = {
    title: "Strona glowna"
  };

  state = { loggedIn: false };

  goToDetails(){
     this.props.navigation.navigate('ALbumDetails');
  }

  componentWillMount(){
    firebase.initializeApp({
        apiKey: "AIzaSyDsYn7L7qlngJnrYMxDOCp4n7zHJK-jRmw",
        authDomain: "albumsviewer.firebaseapp.com",
        databaseURL: "https://albumsviewer.firebaseio.com",
        projectId: "albumsviewer",
        storageBucket: "albumsviewer.appspot.com",
        messagingSenderId: "897404904381"
      });

      // jezeli sie zaloguje => istnieje obiekt user
      // jezeli sie wyloguje => nie ma obiektu user
    firebase.auth().onAuthStateChanged((user) => {
        if (user){
            this.setState({loggedIn: true});
        }
        else {
            this.setState({loggedIn: false});
        }
    })
}

  renderMainPage(){
    if (this.state.loggedIn){
      return(
        <View>
          <Header headerText="Header Text" />
          <LogoutButton />
          <AlbumList />
        </View>
      );
    }
    else {
      return (
        <LoginForm />
      );
    }
  }

  renderAlbumDetails(){
    /* .. */
  }


  render() {
    return (
      <View style={styles.container}>
        {this.renderMainPage()}
      </View>
    );
  }
}

Код App.js:

import React, { Component } from 'react';
import { Text, View } from 'react-native';

import { StackNavigator } from 'react-navigation';
import AlbumDetails from './src/components/AlbumDetails';
import Home from './src/components/Home';

const AppNavigation = StackNavigator({
  Home: {
    screen: "Home"
  },
  AlbumDetails: {
    screen: "AlbumDetails"
  }
});

export default AppNavigation;

index.js код:

import { AppRegistry } from 'react-native';
import AppNavigation from './App';

AppRegistry.registerComponent('albumsViewer', () => AppNavigation);

Я не совсем понимаю, как решить эту проблему.Заранее спасибо.