在Android应用中添加React Native支持

个人实践

• 用android studio创建一个基本的android hello world程序

  
  

  2016-09-28_172701.png

• 在项目根目录中通过npm向导生成package.json文件，在cmd中输入命令:
  npm init

  
  

  2016-09-28_173638.png

• 在package.json文件中添加启动脚本
  "start": "node node_modules/react-native/local-cli/cli.js start"

  
  

  2016-09-28_174027.png

注：这里可能会报一个json的错误，请仔细检查json：

     

• 添加react-native npm依赖，在命令行输入
  npm install react react-native --save

• 创建index.android.js文件

import React from 'react'; import {
  AppRegistry,
  StyleSheet,
  Text,
  View
} from 'react-native'; class HelloWorld extends React.Component {
  render() { return ( <View style={styles.container}> <Text style={styles.hello}>Hello, WorldText> View> )
  }
} var styles = StyleSheet.create({ container: { flex: 1, justifyContent: 'center',
  }, hello: { fontSize: 20, textAlign: 'center', margin: 10,
  },
});

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

• 在你app的build.gradle文件中添加react native依赖库

  
  

  2016-09-28_175004.png

• 在你project的build.gradle文件中添加react native路径

阅读全文直接点击：