Share extension is present, but nothing shows up when sharing

[SirCameron]

IOS: I have followed the instructions correctly. The app builds successfully and it shows up in the "share to" dialog. But when it is tapped, my app does not show up at all. Nothing happens.

[vivekjne]

Hi @SirCameron where you able to solve it?

[SirCameron]

@vivekjne nope.

[vivekjne]

@SirCameron i was able to solve it for me. My app was using react navigation so had to make a separate file and register the extension component in that. i created a file like app.ios and did the appregistry config there then i specified it as the entry file in share extension instead of index.ios. Now everything is working fine. contents of app.ios.js file: import { AppRegistry,Platform } from 'react-native';

import Share from './App/share.ios' AppRegistry.registerComponent('ShareExtention', () => Share)

[SirCameron]

@vivekjne Thanks. I am also using React Navigation, but I would like the share extension to render in the current app, though. I will give your suggestion a go and see how I can work around it.

[Shaktis3]

Hey @SirCameron, there may be issue with extension configuration. If your index.js file is like this

AppRegistry.registerComponent('MyApp', () => App);
AppRegistry.registerComponent('MyShareEx', () => Share) 

There may have dependencies in MyApp which cause issue in launching MyShareEx. So either configure your MyshareEx same like Myapp (not recommended) OR create separate entry point for MyShareEx and have only share component register there like this. AppRegistry.registerComponent('MyShareEx', () => Share) and in MyShareEx.m change @"index" to @"share.ios".

Similiar to #165

[OmarBasem]

@Shaktis3 I have created another file "share.js" as entry point for the share extension and changed index to share in MyShareEx.m, but still not working. I have followed the steps in the installation guide. Is there any further steps that you have done?

[SirCameron]

I've tried using separate entry points and combined entry points. Nothing shows. The entry doesn't even run, it seems. no log output at all. Does this thing even work with React Native > 0.59 ?

[SirCameron]

is the uppercase naming important, ie: MyShareEx and not myShareEx?

[SirCameron]

I finally have the view showing, but as soon as I try to get the data from the share extension, it no longer shows...

const { type, value } = await ShareExtension.data()

the app simply seems to hang.

I have correctly lined the extension and I am importing it.

[SirCameron]

@Shaktis3 @ramon90 I have managed to get this working on iOS, but on android it is not using the correct JS entry... it is using the default index.js, so I'm unable to split the code as you mention above. How can I define the entry point for the Android share activity?

[NikitaPFE]

@SirCameron what did you do to show view? a have same issue

[ajith-ab]

use react-native-file-share-intent

[SirCameron]

@NikitaPFE I got this working only in dev. Running in release, it doesn't work. Seems also that this repo is dead. @alinz hasn't commented in ages.

[colaskirschoff]

@SirCameron how did you get this working in dev ? You were not seeing anything an now you have the view showing ! Please share some insights :)

(I'm using RN 0.60 and react-navigation too)

[mtzfactory]

@SirCameron, I have the same problem you had, when trying to read from the share extension, it crashes... how did you solve it?

const { type, value } = await ShareExtension.data()

[OmarBasem]

My recommendation for anyone wanting to build a share extension is to do it using native code, because as of now there is not any good share extension library for react-native.

[maxto024]

@SirCameron please what have you done lets us now we are stuck here just is not working when i touch share extension

[SirCameron]

So my issue is that I was using firebase and gesture handler and the share extension target was using the same JS entry point as the rest of the app. Your share extension fails if it uses an JS entry that references dependencies that the share extension does not have. To fix this, we need to make the share extension target use a JS entry that has the absolute minimal dependencies. Otherwise you need to look up how to add your Pod dependencies to another target.

First install the share extension as the README describes. Then in appDelegate.m change this line:

jsCodeLocation = [[RCTBundleURLProvider sharedSettings] jsBundleURLForBundleRoot:@"index.ios" fallbackResource:nil];

to:

#if DEBUG
    jsCodeLocation = [[RCTBundleURLProvider sharedSettings] jsBundleURLForBundleRoot:@"share.ios" fallbackResource:nil];
  #else
    jsCodeLocation = [[NSBundle mainBundle] URLForResource:@"share" withExtension:@"jsbundle"];
  #endif

credit: @ajith-ab

where share.ios.js is the entry file for this extension. Whenever you change something in that file, you need to rebundle it using:

./node_modules/.bin/react-native bundle --entry-file ./share.ios.js --platform ios --dev false --bundle-output ./ios/MyShareEx/share.jsbundle --assets-dest ios

You'll notice that in the appDelegate file, the entry point for production is share.jsbundle.

It's a good idea to put the bundling command in your build pipeline. I added it in xcode in share extension target's Build Phases as a new script just after Link Binary with Libraries.

And then ensured that the bundle was also being copied in:

[rufat]

Unfortunately, I stuck at this issue too... @SirCameron did you solve it? :(

[SirCameron]

@oop yup, my comment above is how I solved it.

[rufat]

@SirCameron, thanks for the reply. I have solved this issue by using the fork, https://github.com/RocketChat/rn-extensions-share. It is now stable. Thanks to RocketChat! :)