我目前正在开发一个与本地库反应原生的移动应用程序。由于世博会不支持每个第三方图书馆,项目必须与世博会分开。
当我尝试将视频播放器添加到项目中时出现了问题。我想也许其他一些图书馆与视频播放器相撞,所以我只用了视频播放器做了一个新的清洁项目。
干净的项目与主项目具有相同的设置,与分离的世博会反应原生。
我按照本指南与世博会分开: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工作室中编译代码时,我得到以下错误输出:
我的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(模块:app):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 }}
/>
关于视频模块是link