React Native：无法导入和使用外部包

【问题标题】：React native: Can't import and use external packagesReact Native：无法导入和使用外部包
【发布时间】：2016-11-27 19:11:41
【问题描述】：

我正在尝试使用 react-native-tabbar-navigator 包。我做了 npm install react-native-tabbar-navigator --save 在我的项目目录下安装包。在我的代码中，我有以下导入行来使用包。

import React, { Component } from 'react';
import {TabBarNavigator} from 'react-native-tabbar-navigator'
import MainTab from './MainTab';


import {
  AppRegistry,
  StyleSheet,
  Text,
  View,
} from 'react-native';

但是，在我的 android 模拟器上运行它会出现以下错误：

您似乎正在尝试从 react-native 包中访问“ReactNative.Component”。也许您打算改为从“react”包中访问“React.Component”？

如果我删除 TabBarNavigator 的导入行，错误就会消失。为什么会这样？

我使用的是 0.3.0 版的 tabbarnavigator 和 0.31.0-rc.0 版的 react-native

【问题讨论】：

您使用的是哪个版本的 TabBarNavigator？
我使用的是 0.3.0 版

标签： javascript node.js reactjs npm react-native

【解决方案1】：

那个库已经过时了，在他们发布新版本之前它不会工作。

如您所见，here，TabBarNavigator 正在从 'react-native' 导入 Component，react-native v0.26+ 不支持此功能。

您可以在本地包中手动更改它（node_modules），

替换

var React = require('react-native');
var {
  Component,
  StyleSheet,
  Text,
  View,
  TabBarIOS
} = React;

到这里

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

在 MainTabBar.js 和 MainNavigator.js 中。

无论如何，安装更新的库（如react-native-tab-navigator）会更容易。

【讨论】：