react-native踩过的坑

包管理

添加新的第三方包总会遇到各种问题，不是版本不对就是运行不起来，记录下遇到的问题：

Error: Cannot find module ‘xxx’

module.js:340throw err;^Error: Cannot find module 'xxx'

这个问题若不是没引用包就是需要关联下依赖：

npm install -d

MainApplication.java:5: 错误: 程序包xxx.xxx.xx不存在

如果这个找不到的第三方包不是纯js包，那很有可能是没有link到Android和iOS项目中：
在React Native 0.27+版本中运行：

react-native link xxx-xxx-xx

如果是其它React Native旧版本，需要安装rnpm (npm install -g rnpm)

rnpm link xxx-xxx-xx

也可以手动link，例如在Android中先要将项目添加到 setting. gradle 和 builde.gradle 然后再在MainApplication.java 中的 getPackages() 方法中添加对应的包对象实例到List中。

undefined is not a function (evaluating ‘React.createClass’)

找不到这个方法，是不是React的版本是 ^16.0.0-beta.5，修改版本为 ^16.0.0-alpha.12 就好了：

npm install react@^16.0.0-alpha.12 --save

高版本去掉了这个方法和React.PropTypes，所以这两个地方报错，检查代码，或者检查第三方包，选择修改代码或者回退React版本。

react-navigation

Android的标题不居中

Android中，默认情况下，title是靠左，紧靠返回按钮的，可以通过在stackConfig中添加下面的代码来居中:

        navigationOptions: {            ...            headerTitleStyle: {                ...                alignSelf: 'center'            },            ...        },

如果没有左侧返回按钮或者右侧按钮，标题文字可以居中，但是那种有返回按钮的页面中，会导致title整体向右偏移，所以可以在右侧设置一个View，来让title居中：

    static navigationOptions = ({navigation}) => ({        headerTitle: '标题',        headerRight: (            <View/>        ),    });

这个问题可以关注Android Header Text Not Centered

持续更新React-Native遇到的坑。。。