I have created a custom npm module
(will use xxx instead of its name) and link it manually using npm install
.
I tried very hard and searched :
- [Workarounds] Packager unable to resolve module from /Users/node_modules/
- Error: jest-haste-map: @providesModule naming collision when using a local dependency
before raising a question. I would be thankful if someone tell me what wrong with my code or my approach or any error in my code.
When I run react-native run-android
following error is raised by metro bundler
Error: jest-haste-map: Haste module naming collision:
Duplicate module name: react-native
Paths: E:\cdg-native\CDG\node_modules\react-native-XXX\node_modules\react-native\package.json collides with E:\cdg-native\CDG\node_modules\react-native\package.json
This error is caused by `hasteImpl` returning the same name for different files.
My custom module package.json
is
{
"name": "react-native-xxx",
"version": "1.0.0",
"description": "Library to render xxx",
"main": "index.js",
"scripts": {
"test": "echo \"Error: no test specified\"&& exit 1"
},
"keywords": [
"react native xxx"
],
"author": "Firdous Nath",
"license": "ISC",
"peerDependencies": {
"react": "*",
"react-native": "*"
},
"devDependencies": {
"react": "^16.6.1",
"react-native": "^0.57.5",
"babel-cli": "^6.26.0",
"babel-plugin-transform-class-properties": "^6.24.1",
"babel-plugin-transform-object-rest-spread": "^6.26.0",
"babel-plugin-transform-runtime": "^6.23.0",
"babel-preset-env": "^1.6.1",
"babel-preset-react": "^6.24.1"
}
}
index.js
of the custom module is very simple as below
import React from "react";
import { Text } from "react-native";
export default class XXXView extends React.Component {
render() {
return (
<Text> From custom module </Text>
);
}
}
file where I am using custom module is
import React from "react";
import {StyleSheet, View} from "react-native";
import XXXView from "react-native-xxx"
//import {XXXView} from "react-native-xxx" -> I tried this as well
export default class App extends React.Component {
render() {
return (
<View style={styles.container}>
<XXXView/>
</View>
)
}
}
const styles = StyleSheet.create({
container: {
flex: 1,
justifyContent: "center",
alignItems: "center",
backgroundColor: "#f5fcff"
}
});
I tried npm install /absolute/path/to/xxx
and it linked module correctly. By correctly I mean I can see react-native-xxx
package in nodemodule
directory.
I did all possible ways but nothing worked.
I also tried but got no success
- yarn add /absolute/path/to/react-native-xxx
- react-native link react-native-xxx
- react-native run-android