2

I want to use 'react-native-image-picker' in my application. After importing and following the install instructions from the github instructions. I get a metro bundler crash on run. It can't seem to locate the 'react-image-picker' or it's dependencies?

I have tried initializing a new project and ONLY installing image picker. I have tried running 'react-native link' and 'react-native link react-native-image-picker' in the root. I have tried initializing the project with expo. I've checked the directories that Metro claims are missing, and they look good to me.

import React from 'react';
import {
  StyleSheet,
  ScrollView,
  View,
  Text,
  Button
} from 'react-native';
import ImagePicker from 'react-native-image-picker';

const options = {
  title: 'Select Avatar',
  customButtons: [{ name: 'fb', title: 'Choose Photo from Facebook' }],
  storageOptions: {
    skipBackup: true,
    path: 'images',
  },
};

const App = () => {
  return (
    <Button title="Select Image" onPress={() => {
      ImagePicker.showImagePicker(options, (response) => {console.log('Response = ', response);})
    }} />
  );
};

error: bundling failed: Error: While trying to resolve module react-native-image-picker from file /Users/owenmorris/Documents/GitHub/fecebook/App.js, the package /Users/owenmorris/Documents/GitHub/fecebook/node_modules/react-native-image-picker/package.json was successfully found. However, this package itself specifies a main module field that could not be resolved (/Users/owenmorris/Documents/GitHub/fecebook/node_modules/react-native-image-picker/src/index.ts. Indeed, none of these files exist:

  • /Users/owenmorris/Documents/GitHub/fecebook/node_modules/react-native-image-picker/src/index.ts(.native||.ios.js|.native.js|.js|.ios.json|.native.json|.json|.ios.ts|.native.ts|.ts|.ios.tsx|.native.tsx|.tsx)
  • /Users/owenmorris/Documents/GitHub/fecebook/node_modules/react-native-image-picker/src/index.ts/index(.native||.ios.js|.native.js|.js|.ios.json|.native.json|.json|.ios.ts|.native.ts|.ts|.ios.tsx|.native.tsx|.tsx) at ResolutionRequest.resolveDependency (/Users/owenmorris/Documents/GitHub/fecebook/node_modules/metro/src/node-haste/DependencyGraph/ResolutionRequest.js:65:15) at DependencyGraph.resolveDependency (/Users/owenmorris/Documents/GitHub/fecebook/node_modules/metro/src/node-haste/DependencyGraph.js:283:16) at Object.resolve (/Users/owenmorris/Documents/GitHub/fecebook/node_modules/metro/src/lib/transformHelpers.js:264:42) at /Users/owenmorris/Documents/GitHub/fecebook/node_modules/metro/src/DeltaBundler/traverseDependencies.js:399:31 at Array.map () at resolveDependencies (/Users/owenmorris/Documents/GitHub/fecebook/node_modules/metro/src/DeltaBundler/traverseDependencies.js:396:18) at /Users/owenmorris/Documents/GitHub/fecebook/node_modules/metro/src/DeltaBundler/traverseDependencies.js:269:33 at Generator.next () at asyncGeneratorStep (/Users/owenmorris/Documents/GitHub/fecebook/node_modules/metro/src/DeltaBundler/traverseDependencies.js:87:24) at _next (/Users/owenmorris/Documents/GitHub/fecebook/node_modules/metro/src/DeltaBundler/traverseDependencies.js:107:9) BUNDLE [ios, dev] ./index.js ░░░░░░░░░░░░░░░░ 0.0% (0/1), failed.
4

2 回答 2

0

答案就在这里

简单来说就是：

  1. 第二种解决方案

从 lib/common/js 导入库 从 'react-native-image-picker/lib/commonjs' 导入 ImagePicker；

于 2020-03-24T05:39:59.737 回答
0

我在最新版本中也遇到了类似的问题。我将版本更改为 0.28.0。

npm install react-native-image-picker@0.28.0
npx react-native link react-native-image-picker

请看看它是否适合你。

于 2020-08-08T14:07:59.033 回答