0

私は最近、Cordovaからそれに切り替えるという決定を下したので、React Nativeの周りに頭を浮かべていました。"React Native init"ファイル構造を編集しようとしています

正しく構築するために、コンテナファイルとコンポーネントファイルをsrc内で正しく構造化する方法を理解しようとしています。

この目的のために、元の/ src/mainフォルダにあるjsという名前のフォルダに作成した新しいファイル "app.js"からindex.android.jsのコードを実行しようとしています。

これは、インデックスファイルのコード

/*Both index files index.ios.js and index.android.js MUST be indentical*/ 
var React= require('react-native'); 
var { AppRegistry } = React; 
var App = require('./android/app/src/main/js/app.js') 
AppRegistry.registerComponent('LearnD',() => LearnD); 

そしてapp.jsファイルは、このgist hereで見つけることができます。私は次のエラーを受けてきた

Error

すべてのヘルプは大歓迎以上になります。 ありがとうございます。 Jake。

答えて

1

リアクトネイティブアプリケーションのための典型的なセットアップは、次のようになります。

└── YourApp 
    ├── android   # Native Android files, no .js here 
    ├── index.android.js # Android entry point, must exist 
    ├── index.ios.js  # iOS entry point, must exist 
    ├── ios    # Native iOS files, no .js here 
    └── src    # All your .js sources 
     ├── components # All your .js sources 
     └── main.js  # Your shared entry point 

あなたsrc/main.jsその後、両方のプラットフォームのために単一の共有のエントリ・ポイント・コンポーネントをエクスポートし、src/ディレクトリ内の他のコンポーネントを使用していますすることができます

// src/main.js 
import React, { Component } from 'react'; 
import { View } from 'react-native'; 
import OtherComponent from './components/other-component.js' 

// note export default 
export default class Main extends Component { 
    render() { 
    return (
     <View> 
     <OtherComponent /> 
     </View> 
    ); 
    } 
} 

index.ios.jsおよびindex.android.jsコンポーネントは、アプリケーションルートコンポーネントとしてメインコンポーネントをインポートして登録できます。

// index.ios.js and index.android.js 
// both must exist, but they can be identical 
import { AppRegistry } from 'react-native'; 
import Main from './src/main'; 

AppRegistry.registerComponent('YourApp',() => Main); 

srcディレクトリ内では、アプリケーションコードを適切な方法で整理できます(例: src/componentssrc/containers - 完全にあなたまで!

+0

詳細回答@jevakallioありがとうございます。 非常に役に立ちます。 –

0

ファイルが存在しない行番号48のAppをエクスポートしようとしています。あなたはすでに10行目にexport default class LearnDを持っていますので、48行目を省略すると助けてください

関連する問題