react navigation - Using redux-connected component as screen in StackNavigator -

i'm creating react native app using create-react-native-app, react-navigation , react-redux. i'm trying add redux-connected component screen nested stacknavigator (though nesting seems not make difference, doesn't work either way) , consistently getting error message saying route 'milkstash' should declare screen. when remove redux connection milkstash.js file, works fine. idea how working?

app.js

import react, { component } 'react'; import { stylesheet, text, view } 'react-native'; import { provider } 'react-redux'; import { createstore } 'redux'; import rootreducer './src/reducers'; import appwithnavigation  './src/appwithnavigation';  export default () => (   <provider store = {createstore(rootreducer)}>     <appwithnavigation />   </provider> ); 

appwithnavigation.js

import react, { component } 'react'; import { connect } 'react-redux'; import { stylesheet, text, view, image, button } 'react-native'; import { drawernavigator, stacknavigator } 'react-navigation'; import milkstash './screens' import { statsscreen, faqscreen, addmilk, accountscreen } './screens';  export default class appwithnavigation extends react.component {    render() {     return (         <menunavigator />     );   } }  const milknavigator = stacknavigator(   { milk: { screen: milkstash},     addmilk: { screen: addmilk }   }, );  const accountnavigator = stacknavigator(   { account: {screen: accountscreen}} );  const statsnavigator = stacknavigator(   { stats: {screen: statsscreen }} );  const faqnavigator = stacknavigator(   { faq: {screen: faqscreen}} )  const menunavigator = drawernavigator({     milk: { screen: milknavigator},     account: {screen: accountnavigator},     stats: {screen: statsnavigator},     faq: {screen: faqnavigator},   } );  const styles = stylesheet.create({   container: {     flex: 1,     justifycontent: 'center',     backgroundcolor: '#ecf0f1',   } }); 

milkstash.js

import react, {component} 'react'; import { stylesheet, text, view} 'react-native'; import { stacknavigator } 'react-navigation'; import { connect } 'react-redux'; import { milk } '../../core/models/milk'; import styles './styles.js';  export class milkstash extends component {   constructor(props){     super(props);   }    render() {     return (       <view style={styles.container}>           ....displaying data goes here       </view>     )   } }  function mapstatetoprops(state){   return{     milkstash: state.milkstash   } }  function mapdispatchtoprops(dispatch){   return {     addmilk: (milk) => dispatch(addmilk(milk)),   } }  export default connect(mapstatetoprops, mapdispatchtoprops)(milkstash); 

milk-reducer.js

import {add_milk} '../constants';  const milkreducer = (state = {milkstash: []}, action = {}) => {   switch(action.type){     case add_milk:       var item = action.payload;         return state         .update('milkstash', (milkstash) =>              {                 var milkstashcopy = json.parse(json.stringify(milkstash));                 milkstashcopy.concat(item);                 return milkstashcopy;              });     default:         return state;     } } export default milkreducer; 

reducers.js

export * './milk.js';  import milkreducer './milk'; import { combinereducers } 'redux';  export default rootreducer = combinereducers({     milk: milkreducer }); 

i figured out answer , thought prevent else struggling 3 days. issue had way importing exports milkstash.js. apparently using import milkstash './screens' cause error changing import milkstashcontainer './screens/milkstash/milkstash.js fix problem.

wiki