Блог

В настоящее время я разрабатываю мобильное приложение на языке react-native с библиотекой expo. Поскольку expo не поддерживает все сторонние библиотеки, проект пришлось отделить от expo.

Моя проблема возникла, когда я попытался добавить в проект видеоплеер. Я подумал, что, возможно, какая-то другая библиотека столкнулась с видеопроигрывателем, поэтому я создал новый чистый проект только с видеопроигрывателем.

Чистый проект имеет ту же настройку, что и основной проект, react-native с отдельным expo.

Я следовал этому руководству, чтобы отделиться от expo: https://docs.expo.io/versions/v28.0.0/expokit/detach /

Я следовал этому руководству, чтобы настроить react-native-unimodels: https://github.com/unimodules/react-native-unimodules

Я следовал этому руководству, чтобы добавить видеотеку: https://github.com/expo/expo/tree/master/packages/expo-av

Когда я пытаюсь скомпилировать код в Android studios, я получаю следующую ошибку:

Мой App.js код:

 import React from 'react';
import { StyleSheet, Text, View } from 'react-native';
import { Video } from 'expo-av';

export default class App extends React.Component {
  render() {
    return (
      <Video
        source={{ uri: 'http://d23dyxeqlo5psv.cloudfront.net/big_buck_bunny.mp4' }}
        rate={1.0}
        volume={1.0}
        isMuted={false}
        resizeMode="cover"
        shouldPlay
        isLooping
        style={{ width: 300, height: 300 }}
      />

    );
  }
}

const styles = StyleSheet.create({
  container: {
    flex: 1,
    backgroundColor: '#fff',
    alignItems: 'center',
    justifyContent: 'center',
  },
});
 

Мой build.gradle (модуль: приложение): https://pastebin.com/kHTTdUrM

Мой build.gradle (проект: android): https://pastebin.com/idxF7a8j

Основное приложение:

 public class MainApplication extends ExpoApplication implements AppLoaderPackagesProviderInterface {

  private final ReactModuleRegistryProvider mModuleRegistryProvider = new ReactModuleRegistryProvider(Arrays.<Package>asList(
    new ReactAdapterPackage(),
    new ConstantsPackage(),
    new PermissionsPackage(),
    new FileSystemPackage(),
    new AVPackage()
 ), Arrays.<SingletonModule>asList());

  @Override
  public boolean isDebug() {
    return BuildConfig.DEBUG;
  }

  // Needed for `react-native link`
  public List<ReactPackage> getPackages() {
    return Arrays.<ReactPackage>asList(
      new MainReactPackage(),
      new ModuleRegistryAdapter(mModuleRegistryProvider)
    );
  }

    public List getExpoPackages() {
        return Arrays.asList(
                new CameraPackage(),
                new ConstantsPackage(),
                new SensorsPackage(),
                new FileSystemPackage(),
                new FaceDetectorPackage(),
                new GLPackage(),
                new GoogleSignInPackage(),
                new PermissionsPackage(),
                new SMSPackage(),
                new PrintPackage(),
                new ConstantsPackage(),
                new MediaLibraryPackage(),
                new SegmentPackage(),
                new FontLoaderPackage(),
                new LocationPackage(),
                new ContactsPackage(),
                new BarCodeScannerPackage(),
                new AdMobPackage(),
                new LocalAuthenticationPackage(),
                new LocalizationPackage(),
                new AppAuthPackage(),
                new TaskManagerPackage(),
                new BackgroundFetchPackage()
        );
    }

  @Override
  public String gcmSenderId() {
    return getString(R.string.gcm_defaultSenderId);
  }

  @Override
  public boolean shouldUseInternetKernel() {
    return BuildVariantConstants.USE_INTERNET_KERNEL;
  }

  public static OkHttpClient.Builder okHttpClientBuilder(OkHttpClient.Builder builder) {
    // Customize/override OkHttp client here
    return builder;
  }
} 
 

Обновить:

Мы не нашли никакого решения этой проблемы, связанной с expo, мы полностью удалили библиотеку expo и создали новый проект только с react-native. До сих пор не было никаких проблем с добавлением всех библиотек, необходимых для приложения.

Вы можете использовать video module его, не отсоединяя его.

Вам не нужно делать expo eject .

Видео example.js:

 import { Video } from 'expo';
...
<Video
  source={{ uri: 'http://d23dyxeqlo5psv.cloudfront.net/big_buck_bunny.mp4' }}
  rate={1.0}
  volume={1.0}
  isMuted={false}
  resizeMode="cover"
  shouldPlay
  isLooping
  style={{ width: 300, height: 300 }}
/>
 

это ссылка на видеомодуль