[英]Trying to edit “React Native init” file structure
I have been trying to get my head around React Native as I recently took the decision to switch to it from Cordova. 最近,我决定从Cordova切换到React Native时,我一直在努力使自己了解React Native。
I have been trying to understand how container and component files should be properly structured inside src in order to correctly build. 我一直试图了解如何正确地在src内部构造容器和组件文件,以便正确构建。
To this end I have been attempting to run the initial index.android.js code out of a new file "app.js" which I have created in a folder I called js found in the original /src/main folder. 为此,我一直试图从新文件“ app.js”中运行初始的index.android.js代码,该文件是在我在原始/ src / main文件夹中找到的js文件夹中创建的。
This is the index file code 这是索引文件代码
/*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);
And the app.js file can be found at this gist here . 并且app.js文件可以在这里找到。
I have been then receiving the following error: 然后,我一直收到以下错误:
Any help will be more than appreciated. 任何帮助将不胜感激。 Thanks in advance, Jake.
预先感谢杰克。
A typical setup for a React Native application looks something like: React Native应用程序的典型设置如下所示:
└── 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
Your src/main.js
can then export a single, shared entry point component for both platforms and uses other components inside the src/
directory: 然后,您的
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>
);
}
}
And your index.ios.js
and index.android.js
components can import and register the main component as the application root component: 您的
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);
Within the src
directory, you can then structure your app code in any way you best see fit, eg src/components
and src/containers
- entirely up to you! 然后,在
src
目录中,您可以按照自己认为合适的任何方式来构建应用代码,例如src/components
和src/containers
完全由您决定!
Your file is trying to export App
on line 48, which does not exist. 您的文件正在尝试导出不存在的第48行上的
App
。 You already have export default class LearnD
on line 10, so omit line 48 and that should help 您已经在第10行上
export default class LearnD
,因此省略第48行,应该会有所帮助
声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.