React-native-document-picker: Better documentation - here's how you REALLY install [iOS]

[agates4]

This should be added to the documentation. It's much more clear and will save headaches in debugging issues.

1. Enable cloud capabilities
   
   If you have automatic code signing, this will be created and handled for you. It's important to check the boxes exactly as shown in the picture.

2. Run
   npm install git://github.com/Elyx0/react-native-document-picker.git#v3 --save
   This installs the latest updates in the document picker.

3. Run
   react-native link
   Links android modules, I honestly don't think it does anything for iOS but may as well run it anyway.

4. Open your project in XCode, right click on Libraries and click Add Files to "Your Project Name"
   
   

5. Add libRNDocumentPicker.a to Build Phases -> Link Binary With Libraries
   

6. Now, restart your entire simulator, packager, debugger etc (quit out of running stuff and rerun it)

7. Should be done and working now.

For testing purposes, if you want to see if it is working, try the following react-native code:
console.log(DocumentPicker)

try {
    const res = DocumentPicker.pick({
        type: [DocumentPicker.types.images],
    });
    console.log(
        res.uri,
        res.type, // mime type
        res.name,
        res.size
    );
} catch ( err ) {
    if ( DocumentPicker.isCancel(err) ) {
        // User cancelled the picker, exit any dialogs or menus and move on
    } else {
        throw err;
    }
}

[fretman92]

Thanks for this help!
I'll add you need to enroll the paid Apple developer program to activate the iCloud entitlement...

[GrishmaM]

@agates4 followed all the steps u specified but facing the below issues while IOS build

duplicate symbol _OBJC_IVAR_$_RNDocumentPicker.composeViews
duplicate symbol _OBJC_IVAR_$_RNDocumentPicker.composeCallbacks
duplicate symbol _OBJC_CLASS_$_RNDocumentPicker
duplicate symbol _OBJC_METACLASS_$_RNDocumentPicker
duplicate symbol _OBJC_IVAR_$_RNDocumentPicker._bridge
ld: 5 duplicate symbols for architecture x86_64
clang: error: linker command failed with exit code 1 (use -v to see invocation)

any solution?

[agates4]

@GrishmaM if you're getting that error, add this to your Podfile (in the iOS folder). This should be added to your target scheme

target 'MyApp' do
    # Uncomment the next line if you're using Swift or would like to use dynamic frameworks
    # use_frameworks!

    # Pods for MyApp
    rn_path = '../node_modules/react-native'
    pod 'yoga', path: "#{rn_path}/ReactCommon/yoga/yoga.podspec"
    pod 'React', path: rn_path, subspecs: [
        'Core',
        'RCTActionSheet',
        'RCTAnimation',
        'RCTGeolocation',
        'RCTImage',
        'RCTLinkingIOS',
        'RCTNetwork',
        'RCTSettings',
        'RCTText',
        'RCTVibration',
        'RCTWebSocket',
        'DevSupport'
    ]

    pod 'react-native-document-picker', :path => '../node_modules/react-native-document-picker`

end

# very important to have the below added to the very end of the Podfile
post_install do |installer|
    installer.pods_project.targets.each do |target|
        if target.name == "React"
            target.remove_from_project
        end
    end
end

Then, in the command prompt use the command pod deintegrate and after it is completed, do pod install

That should solve it!

[DavitVosk]

@agates4 Thanks for your great and simple explanation. Just one single note: since in your used version DocumentPicker is exported as default, then we should use the following import:

import DocumentPicker from "react-native-document-picker"

[DavitVosk]

@agates4 do you know whether there is an option to preview the document before picking it?

[miajohansson9]

I followed these directions _exactly_ and rebuilt my app, but I'm getting this warning: RNDocumentPicker: Native module is not available, make sure you have finished the installation process and rebuilt your app. Does anyone know how I can fix this?

[agates4]

I followed these directions _exactly_ and rebuilt my app, but I'm getting this warning: RNDocumentPicker: Native module is not available, make sure you have finished the installation process and rebuilt your app. Does anyone know how I can fix this?

My gut tells me this is a caching issue

Maybe try
delete package.lock and node_modules/
npm install
delete Podfile.lock and Pods/
clear Xcode build with Command + Shift + K
quit Xcode
Pod install in the ios/ folder

If it still doesn't work, then there's something else going on

[miajohansson9]

What finally worked for me was installing with cocoa pods and then changing my code to:

var DocumentPicker = require('react-native-document-picker');

DocumentPicker.default.pick({
                            type: [DocumentPicker.default.types.allFiles],
                          },(error,res) => {
                            // Android
                            console.log(
                              "Okay Bhai error paichi Document Picker e: ",
                              res.uri,
                              res.type,
                              res.fileName,
                              res.fileSize
                            );
                          })

[jetobe95]

Is it posible to add an option of file size limit?

[ezranbayantemur]

I tried these steps (and that on docs) but it gives RTCDefines.h error. I opened an issue about it

https://github.com/Elyx0/react-native-document-picker/issues/249

[kidequinox]

Having similar issue when building for IOS,

"react-native": "0.59.10"
"react-native-document-picker": "^3.2.2"

ld: warning: directory not found for option '-L/Users/{user}/Library/Developer/Xcode/DerivedData/app-cdhuqaxbqwujfufogqftsrampkmb/Build/Products/Debug-iphonesimulator/React'

duplicate symbol '_OBJC_IVAR_$_RNDocumentPicker.composeViews' in:
    /Users/{user}/Library/Developer/Xcode/DerivedData/app-cdhuqaxbqwujfufogqftsrampkmb/Build/Products/Debug-iphonesimulator/react-native-document-picker/libreact-native-document-picker.a(RNDocumentPicker.o)
    /Users/{user}/Library/Developer/Xcode/DerivedData/app-cdhuqaxbqwujfufogqftsrampkmb/Build/Products/Debug-iphonesimulator/libRNDocumentPicker.a(RNDocumentPicker.o)

duplicate symbol '_OBJC_IVAR_$_RNDocumentPicker.composeResolvers' in:
    /Users/{user}/Library/Developer/Xcode/DerivedData/app-cdhuqaxbqwujfufogqftsrampkmb/Build/Products/Debug-iphonesimulator/react-native-document-picker/libreact-native-document-picker.a(RNDocumentPicker.o)
    /Users/{user}/Library/Developer/Xcode/DerivedData/app-cdhuqaxbqwujfufogqftsrampkmb/Build/Products/Debug-iphonesimulator/libRNDocumentPicker.a(RNDocumentPicker.o)
... etc...
ld: 6 duplicate symbols for architecture x86_64
clang: error: linker command failed with exit code 1 (use -v to see invocation)

[kidequinox]

React Native 0.50.10
"react-native-document-picker": "^3.2.4"

Got this to work by removing
LibRNDocumentPicker.a from Link Binary with Libraries in xcode.

[vonovak]

closing as resolved, the image is in the readme and autolinking makes the install process easier. If you find that the installation instructions need improvement, please open a PR, thank you