Reputation: 1807
I am getting an error when trying to load my component:
Failed to load bundle(http://localhost:8081/index.bundle?platform=ios&dev=true&minify=false) with error:(Unable to resolve module
components/Items
from/Users/vemundeldegard/AwesomeProject/app/screens/Home.js
: Modulecomponents/Items
does not exist in the Haste module mapThis might be related to https://github.com/facebook/react-native/issues/4968 To resolve try the following: 1. Clear watchman watches:
watchman watch-del-all
. 2. Delete thenode_modules
folder:rm -rf node_modules && npm install
. 3. Reset Metro Bundler cache:rm -rf /tmp/metro-bundler-cache-*
ornpm start -- --reset-cache
. 4. Remove haste cache:rm -rf /tmp/haste-map-react-native-packager-*
. (null))
Trying to load my component in screen which is called screens/home.js, which is then loaded in my app.js.
Added this to the top of the /screens/home.js file:
import Items from 'components/Items';
And calling it in the render like this <Items />
components/items.js looks like this:
import React, { Component } from 'react';
import {
StyleSheet,
Text,
View
} from 'react-native';
const Items = () => {
return (
<View>This is now an item</View>
)
}
export default Items;
Why can't I load a component? Tried doing what the error says.
Upvotes: 1
Views: 1434
Reputation: 737
If the file location is right as you mentioned, import Items from '../components/items';
should be right.
But the important thing is after you add new files such as js or image files, you need to restart the node modules.
Upvotes: 1
Reputation: 1533
Try doing import Items from '../components/items'
, actually your file is named items
(without capital i) instead of Items
.
Upvotes: 1