क्रॉस-प्लेटफ़ॉर्म ऐप के लिए प्रतिक्रियात्मक मूल में index.js (index.ios.js, index.android.js) के बजाय index.js का उपयोग कैसे करें?

Question

अब से जवाब के लिए धन्यवाद,

मैं में एक नौसिखिया प्रतिक्रिया मूल निवासी हूँ, मैं एक पार मंच अनुप्रयोग बनाना चाहते तो मैं index.js बनाया:

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

class ReactApp extends Component { 

    render() { 
     return (
      <View><Text>Hello world</Text></View> 
     ); 
    } 
} 

module.exports = ReactApp; 

तब मैं सूचकांक आयातित .js दोनों index.ios.js और इस तरह index.android.js से:

import { AppRegistry } from 'react-native'; 
import ReactApp from './index'; 

AppRegistry.registerComponent('ReactApp',() => ReactApp); 

मैं इस के बाद लगता है कि यह काम करना चाहिए, लेकिन मैं इस त्रुटि मिलती है:

Answer 1

के बाद प्रतिक्रिया v0.49, आप डॉन index.ios.js और index.android.js की आवश्यकता नहीं है। आप केवल जरूरत है index.js: (https://github.com/facebook/react-native/releases/tag/v0.49.0)

New projects have a single entry-point (index.js) from now on

Answer 2

आप इस पीछे के बारे में जा रहे हैं। index.ios.js और index.android.js हमेशा डिफ़ॉल्ट react-native init प्रोजेक्ट में अलग-अलग प्रविष्टि बिंदु होंगे। यदि आप उन्हें index.js के माध्यम से एक ही कोडबेस चलाने के लिए चाहते हैं, तो आपको इसे index.ios.js और index.android.js आयात index.js आयात करना चाहिए और index.js में परिभाषित समान आधार घटक पंजीकृत करना चाहिए।

उदाहरण के लिए, आप देख सकते हैं कि यह example ToDo app (Github repo here) में कैसे किया गया है।

यदि आप अपने रूट फ़ोल्डर में index.js डालते हैं, तो यह index.android.js और index.ios.js के साथ संघर्ष करेगा जब आप इसे सीधे संदर्भित नहीं करते हैं। तो आपको अपने आयात में सटीक पथ को इंगित करने की आवश्यकता होगी। नीचे दिया गया कोड देखें।

index.ios.js और index.android.js (समान सामग्री)

import React from 'react'; 
import { AppRegistry } from 'react-native' 
import ReactApp from './index.js' 
// Had you placed index.js in another folder like `./app`, you could instead do your import with this shorthand: 
// import ReactApp from './app' 

AppRegistry.registerComponent('ReactApp',() => ReactApp) 

index.js

// Note: I noticed that you imported Component from the wrong place. That might also be contributing to your issue so I fixed it here. 
import React, { Component } from 'react'; 
import { 
    View, 
    Text, 
} from 'react-native'; 

// Unless you are exporting multiple things from a single file, you should just use this. 
// It's more idiomatic than using module.exports = ReactApp; 
export default class ReactApp extends Component { 
    render() { 
     return (
      <View><Text>Hello world</Text></View> 
     ); 
    } 
}