docs: Update expo install docs

This commit is contained in:
Marc Rousavy 2021-07-07 16:13:15 +02:00
parent b40d3ddc6b
commit a4397e1978

View File

@ -17,11 +17,31 @@ import useBaseUrl from '@docusaurus/useBaseUrl';
Install [**react-native-vision-camera**](https://www.npmjs.com/package/react-native-vision-camera) through npm: Install [**react-native-vision-camera**](https://www.npmjs.com/package/react-native-vision-camera) through npm:
<Tabs
groupId="environment"
defaultValue="rn"
values={[
{label: 'React Native', value: 'rn'},
{label: 'Expo', value: 'expo'}
]}>
<TabItem value="rn">
```bash ```bash
npm i react-native-vision-camera npm i react-native-vision-camera
npx pod-install npx pod-install
``` ```
</TabItem>
<TabItem value="expo">
```bash
expo install react-native-vision-camera
```
</TabItem>
</Tabs>
VisionCamera requires **iOS 11 or higher**, and **Android-SDK version 21 or higher**. See [Troubleshooting](/docs/guides/troubleshooting) if you're having installation issues. VisionCamera requires **iOS 11 or higher**, and **Android-SDK version 21 or higher**. See [Troubleshooting](/docs/guides/troubleshooting) if you're having installation issues.
> **(Optional)** If you want to use [**Frame Processors**](/docs/guides/frame-processors), you need to install [**react-native-reanimated**](https://github.com/software-mansion/react-native-reanimated) 2.2.0 or higher. > **(Optional)** If you want to use [**Frame Processors**](/docs/guides/frame-processors), you need to install [**react-native-reanimated**](https://github.com/software-mansion/react-native-reanimated) 2.2.0 or higher.
@ -31,12 +51,13 @@ VisionCamera requires **iOS 11 or higher**, and **Android-SDK version 21 or high
To use a Camera or Microphone you must first specify that your app requires camera and microphone permissions. To use a Camera or Microphone you must first specify that your app requires camera and microphone permissions.
<Tabs <Tabs
defaultValue="bare-rn" groupId="environment"
defaultValue="rn"
values={[ values={[
{label: 'Bare React Native', value: 'bare-rn'}, {label: 'React Native', value: 'rn'},
{label: 'Expo', value: 'expo'} {label: 'Expo', value: 'expo'}
]}> ]}>
<TabItem value="bare-rn"> <TabItem value="rn">
### iOS ### iOS
@ -44,10 +65,11 @@ Open your project's `Info.plist` and add the following lines inside the outermos
```xml ```xml
<key>NSCameraUsageDescription</key> <key>NSCameraUsageDescription</key>
<string>$(PRODUCT_NAME) needs access to your Camera to record videos and capture photos.</string> <string>$(PRODUCT_NAME) needs access to your Camera.</string>
<!-- optionally, if you want to record audio: --> <!-- optionally, if you want to record audio: -->
<key>NSMicrophoneUsageDescription</key> <key>NSMicrophoneUsageDescription</key>
<string>$(PRODUCT_NAME) needs access to your Microphone to record videos with audio.</string> <string>$(PRODUCT_NAME) needs access to your Microphone.</string>
``` ```
### Android ### Android
@ -56,6 +78,7 @@ Open your project's `AndroidManifest.xml` and add the following lines inside the
```xml ```xml
<uses-permission android:name="android.permission.CAMERA" /> <uses-permission android:name="android.permission.CAMERA" />
<!-- optionally, if you want to record audio: --> <!-- optionally, if you want to record audio: -->
<uses-permission android:name="android.permission.RECORD_AUDIO" /> <uses-permission android:name="android.permission.RECORD_AUDIO" />
``` ```
@ -67,24 +90,25 @@ Open your project's `AndroidManifest.xml` and add the following lines inside the
Add the VisionCamera plugin to your Expo config (`app.json`, `app.config.json` or `app.config.js`): Add the VisionCamera plugin to your Expo config (`app.json`, `app.config.json` or `app.config.js`):
```json ```json {5-12}
{ {
"name": "my app", "name": "my app",
"plugins": [ "plugins": [
[ [
"react-native-vision-camera", "react-native-vision-camera",
{ {
"cameraPermissionText": "$(PRODUCT_NAME) needs access to your Camera to record videos and capture photos.", "cameraPermissionText": "$(PRODUCT_NAME) needs access to your Camera.",
// optionally, if you want to record audio: // optionally, if you want to record audio:
"enableMicrophonePermission": true, "enableMicrophonePermission": true,
"microphonePermissionText": "$(PRODUCT_NAME) needs access to your Microphone to record videos with audio." "microphonePermissionText": "$(PRODUCT_NAME) needs access to your Microphone."
} }
] ]
] ]
} }
``` ```
Finally, run the following command to compile the mods: Finally, compile the mods:
```bash ```bash
expo prebuild expo prebuild