Использование единого входного файла для реакции собственного приложения

1

Я пытаюсь использовать один файл входа для android и iOS в приложении React Native.

Я последовал за несколькими учебниками и получил следующее:

index.js

import React, { Component } from 'react';
import { Text } from 'react-native';

export default class Main extends Component {
   render() {
      return (
        <Text>Hello world! from both IOS and Android</Text>
      );
   }
}

index.ios.js

import React from 'react';
import { AppRegistry } from 'react-native';
import {Main} from './index';


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

Я получаю следующую ошибку:

Element type is invalid: expected a string(for built-in components) or a class/function (for composite components) but got: undefined. You likely forgot to export your component from the file it defined in.

Если я удалю фигурные скобки из Main в инструкции import, это говорит: "... но получил: object", поэтому мне кажется, что это связано с моим экспортом/импортом, но ничего не работает. Любая помощь будет оценена по достоинству.

Теги:
react-native
cross-platform

2 ответа

1

Вы экспортируете свой Main компонент как:

export default class Main extends Component {

но импортировать как:

import {Main} from './index';

default export должен быть импортирован как:

import Main from './index';

Если вы используете экспорт по умолчанию, вы должны импортировать как это. Если это не работает, в вашем коде должна быть другая проблема.

  • 0
    Спасибо за быстрый ответ. Если я удаляю фигурные скобки, у меня появляется та же ошибка, но она говорит «объект» вместо «неопределенный». Любые идеи относительно того, что еще может быть причиной проблемы? Я могу опубликовать другой соответствующий код, если это будет необходимо.
  • 0
    Вы можете вставить целое сообщение?
Показать ещё 2 комментария
0

React Native пытается импортировать на платформе. Например, если у вас есть index.ios.js и index.android.js в той же папке, React Native будет index.ios.js только если он index.ios.js для ios. Возможно, что при импорте из ./index, React Native index.ios.js путь с index.ios.js вместо index.js потому что вы объединяете для ios.

Если вам интересно, вы можете попробовать console.log содержимое импортированного модуля, например console.log(Main) чтобы узнать, что на самом деле импортируется.

Ещё вопросы

Сообщество Overcoder
Наверх
Меню