Undefined is not an object (evaluating '_$$_REQUIRE(_dependencyMap[5], "expo-camera").Camera')

Question

I am trying to install the expo camera on my device, but I keep running into problems. I only did 3 things

1. expo install expo-camera.
2. copy the example code to my project.
3. add expo camera to package.json.

I followed this tutorial: https://docs.expo.dev/versions/latest/sdk/camera/

I think the problem might be: In managed apps, Camera requires Permissions.CAMERA. Video recording requires Permissions.AUDIO_RECORDING. In managed apps, Camera requires Permissions.CAMERA. Video recording requires Permissions.AUDIO_RECORDING.

I have no clue what to do with that.

Good to know:

• I also tried to install the react native camera https://react-native-camera.github.io/react-native-camera/docs/installation . with no succes ofcourse :(

Package.json:

{
  "name": "untitled",
  "version": "0.0.1",
  "private": true,
  "scripts": {
    "android": "react-native run-android",
    "ios": "react-native run-ios",
    "start": "react-native start",
    "test": "jest",
    "lint": "eslint ."
  },
  "dependencies": {
    "react": "17.0.2",
    "react-native": "0.67.2"
  },
  "devDependencies": {
    "@babel/core": "^7.16.12",
    "@babel/runtime": "^7.16.7",
    "@react-native-community/eslint-config": "^3.0.1",
    "babel-jest": "^27.4.6",
    "eslint": "^7.32.0",
    "jest": "^27.4.7",
    "metro-react-native-babel-preset": "^0.67.0",
    "react-test-renderer": "17.0.2",
    "expo-camera": "~12.0.3"
  },
  "jest": {
    "preset": "react-native"
  }
}

Camera.js

import React, {useState, useEffect} from 'react';
import {StyleSheet, Text, View, TouchableOpacity} from 'react-native';
import {Camera} from 'expo-camera';

export default function App() {
  const [hasPermission, setHasPermission] = useState(null);
  const [type, setType] = useState(Camera.Constants.Type.back);

  useEffect(() => {
    (async () => {
      const {status} = await Camera.requestCameraPermissionsAsync();
      setHasPermission(status === 'granted');
    })();
  }, []);

  if (hasPermission === null) {
    return <View />;
  }
  if (hasPermission === false) {
    return <Text>No access to camera</Text>;
  }
  return (
    <View style={styles.container}>
      <Camera style={styles.camera} type={type}>
        <View style={styles.buttonContainer}>
          <TouchableOpacity
            style={styles.button}
            onPress={() => {
              setType(
                type === Camera.Constants.Type.back
                  ? Camera.Constants.Type.front
                  : Camera.Constants.Type.back,
              );
            }}>
            <Text style={styles.text}> Flip </Text>
          </TouchableOpacity>
        </View>
      </Camera>
    </View>
  );
}

const styles = StyleSheet.create({});

Errors:

Answer 1

I think the problem might be that you have the expo-camera dependency as a development dependency.

{
  ...
  devDependencies:{
    "expo-camera": "~12.0.3"
  }
  ...
}