React Native Unable to resolve module crypt의 대응 방법

배경.

현재 관련 항목은 monorepo를 채택했습니다.
React, React Native, Node.js 등 여러 개의 포장이 있고 쌍방이 사용하고 싶은 처리 등은 모두 공동 포장에 놓여 있다.
이번에 범용 포장지에 사용crypto.createCipheriv된 파일을 올렸는데 그 결과 리액트 네이티브에서 오류가 발생했다.
crypto는 Node입니다.암호화 js에 내장된 모듈입니다
https://dev.classmethod.jp/articles/node-js_encryption/

오류 로그

error: Error: Unable to resolve module crypto from .../crypto.ts:
crypto could not be found within the project or in these directories:
  ../../node_modules

If you are sure the module exists, try these steps:
 1. Clear watchman watches: watchman watch-del-all
 2. Delete node_modules and run yarn install
 3. Reset Metro's cache: yarn start --reset-cache
 4. Remove the cache: rm -rf /tmp/metro-*
> 1 | import crypto from "crypto";

까닭

React Native는 Node입니다.js에서 실행되지 않고 허메스와 자바스크립트 코어 등 자바스크립트 엔진을 사용하기 때문에 노드입니다.내장된 js 모듈이 실행되지 않습니다.통용되는 포장crypto을 사용했기 때문에 상술한 오류가 발생했다.

대응 조사

crypto-js

npm의 암호화용 라이브러리 crypto-js에서 crypto에 적힌 코드를 대체할 수 있는지 조사했지만 crypt에서 사용된createCipheriv 등 방법은 사용할 수 없습니다.

react-native-crypto

react-native-crypto에서 rn-nodeify로 설치했지만 rn-nodeify는 개작node_modules 중인 구조여서 모로포가 순조롭게 돌아가지 못했다.

해결책

참고react-native-crypto 중의 issue, metro.config.js 내의 extraNodeModules 중
crypto-browserify,crypto를 추가하여 사용 가능, 이미 해결
https://github.com/tradle/react-native-crypto/issues/46

    resolver: {
      extraNodeModules: {
        crypto: require.resolve("crypto-browserify"),
        stream: require.resolve("readable-stream"),
      },
    },

crypto-browserify 내부에서stream 사용하기 때문에 추가readable-stream이번에는 사용react-native-crypto이 아니라 사용crypto-browserify했다.react-native-crypto에서는 가져오기react-native-randombyte가 필요하지만 로컬 모듈을 사용했기 때문에 pod install 등의 조작이 필요하기 때문에 성능이 좋을 것입니다.

총결산

React Native crypto 등 단어로 검색하는 방법도 다양하고 오래된 정보도 있어 해결하기 어렵다.Node.React Native 등 js를 사용하는 crypto가 있다면 참고할 수 있을 것 같습니다.