Niclas Niclas - 1 month ago 24
React JSX Question

How to require Stateless Functional Components (Unknown module _createWrapper?)

I'm trying to learn how to use Stateless Functional Components, and require it like this:

const Button = require('./components/Button');


And in Button.js:

import React from 'react';

const { Text, View, TouchableOpacity,} = ReactNative;
const Button = () => {
return (
<View><Text>Button</Text></View>
);
}
export default Button;


This gives me:


Requiring unknown module "./_createWrapper".If you are sure the module
is there, try restarting the packager or running "npm install".


If I do it inline, like this, it works:

const Button = () =>
<View><Text>Button</Text></View>


But since I'd like to keep it as a reusable component, I want it in a file. How should I do?

Answer

Require is a commonJs import syntax and export default is ES6 export syntax.

so stick to one thing commonjs or ES6 Modules.

In Button.js while exporting

use module.exports = Button;

or you can use es6 import statements while importing

import Button from './components/Button'