Caver-js 모듈 에러문제 문의

한국어🇰🇷 Caver
1

안녕하세요
klaytn_address로 caver-js를 이용하여 balance구하려고 하는중에 caver-js 모듈을 깔면 아래와같이 에러메세지가 쭉 뜨더라구요…

그래서 에러에 해당하는 모듈들(install ‘stream-http’, install ‘https-browserify’, install ‘url’, install ‘crypto-browserify’, install ‘stream-browserify’, )을 설치했더니 그래도 계속 같은 에러가 떠서 문의를 남깁니다. ㅠㅠ

ERROR in ./node_modules/caver-js/packages/caver-core-requestmanager/caver-providers-http/src/index.js 31:13-28
Module not found: Error: Can’t resolve ‘http’ in ‘/Users/imhyeonjeong/Desktop/blockchain/node_modules/caver-js/packages/caver-core-requestmanager/caver-providers-http/src’
BREAKING CHANGE: webpack < 5 used to include polyfills for node.js core modules by default.
This is no longer the case. Verify if you need this module and configure a polyfill for it.
If you want to include a polyfill, you need to:
- add a fallback ‘resolve.fallback: { “http”: require.resolve(“stream-http”) }’
- install ‘stream-http’
If you don’t want to include a polyfill, you can use an empty module like this:
resolve.fallback: { “http”: false }

ERROR in ./node_modules/caver-js/packages/caver-core-requestmanager/caver-providers-http/src/index.js 33:14-30
Module not found: Error: Can’t resolve ‘https’ in ‘/Users/imhyeonjeong/Desktop/blockchain/node_modules/caver-js/packages/caver-core-requestmanager/caver-providers-http/src’
BREAKING CHANGE: webpack < 5 used to include polyfills for node.js core modules by default.
This is no longer the case. Verify if you need this module and configure a polyfill for it.
If you want to include a polyfill, you need to:
- add a fallback ‘resolve.fallback: { “https”: require.resolve(“https-browserify”) }’
- install ‘https-browserify’
If you don’t want to include a polyfill, you can use an empty module like this:
resolve.fallback: { “https”: false }

ERROR in ./node_modules/caver-js/packages/caver-core-requestmanager/caver-providers-ws/src/helpers.js 14:14-28
Module not found: Error: Can’t resolve ‘url’ in ‘/Users/imhyeonjeong/Desktop/blockchain/node_modules/caver-js/packages/caver-core-requestmanager/caver-providers-ws/src’
BREAKING CHANGE: webpack < 5 used to include polyfills for node.js core modules by default.
This is no longer the case. Verify if you need this module and configure a polyfill for it.
If you want to include a polyfill, you need to:
- add a fallback ‘resolve.fallback: { “url”: require.resolve(“url/”) }’
- install ‘url’
If you don’t want to include a polyfill, you can use an empty module like this:
resolve.fallback: { “url”: false }

ERROR in ./node_modules/caver-js/packages/caver-klay/caver-klay-accounts/src/index.js 42:76-93
Module not found: Error: Can’t resolve ‘crypto’ in ‘/Users/imhyeonjeong/Desktop/blockchain/node_modules/caver-js/packages/caver-klay/caver-klay-accounts/src’
BREAKING CHANGE: webpack < 5 used to include polyfills for node.js core modules by default.
This is no longer the case. Verify if you need this module and configure a polyfill for it.
If you want to include a polyfill, you need to:
- add a fallback ‘resolve.fallback: { “crypto”: require.resolve(“crypto-browserify”) }’
- install ‘crypto-browserify’
If you don’t want to include a polyfill, you can use an empty module like this:
resolve.fallback: { “crypto”: false }

ERROR in ./node_modules/caver-js/packages/caver-utils/randomhex/crypto.js 18:0-34
Module not found: Error: Can’t resolve ‘crypto’ in ‘/Users/imhyeonjeong/Desktop/blockchain/node_modules/caver-js/packages/caver-utils/randomhex’
Did you mean ‘./crypto’?
Requests that should resolve in the current directory need to start with ‘./’.
Requests that start with a name are treated as module requests and resolve within module directories (node_modules, /Users/imhyeonjeong/Desktop/blockchain/node_modules).
If changing the source code is not an option there is also a resolve options called ‘preferRelative’ which tries to resolve these kind of requests in the current directory too.
BREAKING CHANGE: webpack < 5 used to include polyfills for node.js core modules by default.
This is no longer the case. Verify if you need this module and configure a polyfill for it.
If you want to include a polyfill, you need to:
- add a fallback ‘resolve.fallback: { “crypto”: require.resolve(“crypto-browserify”) }’
- install ‘crypto-browserify’
If you don’t want to include a polyfill, you can use an empty module like this:
resolve.fallback: { “crypto”: false }

ERROR in ./node_modules/caver-js/packages/caver-wallet/src/keyring/keyringHelper.js 24:76-93
Module not found: Error: Can’t resolve ‘crypto’ in ‘/Users/imhyeonjeong/Desktop/blockchain/node_modules/caver-js/packages/caver-wallet/src/keyring’
BREAKING CHANGE: webpack < 5 used to include polyfills for node.js core modules by default.
This is no longer the case. Verify if you need this module and configure a polyfill for it.
If you want to include a polyfill, you need to:
- add a fallback ‘resolve.fallback: { “crypto”: require.resolve(“crypto-browserify”) }’
- install ‘crypto-browserify’
If you don’t want to include a polyfill, you can use an empty module like this:
resolve.fallback: { “crypto”: false }

ERROR in ./node_modules/cipher-base/index.js 3:16-43
Module not found: Error: Can’t resolve ‘stream’ in ‘/Users/imhyeonjeong/Desktop/blockchain/node_modules/cipher-base’
BREAKING CHANGE: webpack < 5 used to include polyfills for node.js core modules by default.
This is no longer the case. Verify if you need this module and configure a polyfill for it.
If you want to include a polyfill, you need to:
- add a fallback ‘resolve.fallback: { “stream”: require.resolve(“stream-browserify”) }’
- install ‘stream-browserify’
If you don’t want to include a polyfill, you can use an empty module like this:
resolve.fallback: { “stream”: false }

ERROR in ./node_modules/eth-lib/lib/bytes.js 7:193-227
Module not found: Error: Can’t resolve ‘crypto’ in ‘/Users/imhyeonjeong/Desktop/blockchain/node_modules/eth-lib/lib’
BREAKING CHANGE: webpack < 5 used to include polyfills for node.js core modules by default.
This is no longer the case. Verify if you need this module and configure a polyfill for it.
If you want to include a polyfill, you need to:
- add a fallback ‘resolve.fallback: { “crypto”: require.resolve(“crypto-browserify”) }’
- install ‘crypto-browserify’
If you don’t want to include a polyfill, you can use an empty module like this:
resolve.fallback: { “crypto”: false }

ERROR in ./node_modules/xhr2-cookies/dist/xml-http-request.js 37:11-26
Module not found: Error: Can’t resolve ‘http’ in ‘/Users/imhyeonjeong/Desktop/blockchain/node_modules/xhr2-cookies/dist’
BREAKING CHANGE: webpack < 5 used to include polyfills for node.js core modules by default.
This is no longer the case. Verify if you need this module and configure a polyfill for it.
If you want to include a polyfill, you need to:
- add a fallback ‘resolve.fallback: { “http”: require.resolve(“stream-http”) }’
- install ‘stream-http’
If you don’t want to include a polyfill, you can use an empty module like this:
resolve.fallback: { “http”: false }

2

안녕하세요 제가 예상하는 시나리오는 다음과 같습니다.

create-react-app 을 사용하여 리엑트 보일러플레이트를 생성하고

caver-js를 설치하여 모듈을 불러왔는데 제대로 로드되지않았다.

위 내용이 맞다면 오류를 다음과같이 해결할 수 있을것같습니다.

“react-scripts”: “5.0.0” → “react-scripts”: “4.0.3” 변경 후 모듈 재설치 후

yarn start or npm run start

이렇게 하시면 해결될것으로 보입니다.

react-scripts 5.x를 사용하여 하는 방법은 webpack config 파일을 수정하는 방법은 있지만 eject하거나 wrapping 해야하므로 추천드리지 않습니다.

1개의 좋아요
3

답변 감사합니다.
“react-scripts”: “4.0.3” 변경 후 모듈 재설치 후 실행을 하려하니 에러가 전보다 더 많이뜨고 npm start가 안됩니다…ㅠㅠ

“react-scripts”: “5.0.0” 를 사용할때는 아래와같은 에러가뜨는데 js파일들에는 오류가안뜨고 모듈다운문제같은데 뭐가 잘못된건지 모르겠습니다ㅠㅠ…

image
image1566×414 189 KB

image
image1740×338 93.8 KB

4

node_modules 폴더를 삭제하고 npm install 해보시겠어요?

그리고 npm run start후 어떤 오류가 나는지 첨부 부탁드립니다.

5

“react-scripts”: “5.0.0” 를 사용하고 node_modules 폴더를 삭제후에 npm install caver-js 하고 터미널에 발생한 에러화면입니다.

image
image1722×1034 161 KB

npm start 한 화면입니다!
계속 같은에러가 나네요…

image
image1758×972 111 KB

image
image1724×874 111 KB

image
image1712×1158 139 KB

image
image1698×848 106 KB

image
image1720×1190 308 KB

image
image1706×854 105 KB

image
image1630×772 195 KB

image
image1654×758 197 KB

image
image1714×752 115 KB

image
image1726×760 119 KB

image
image1678×768 193 KB

6

자 처음부터 다시 해보겠습니다.

5.0.0을 사용하여 해결하는 방법은 따로 알려드리지 않았습니다.

일단 package.json안의 react-scripts 버전을 4.0.3으로 변경해주세요.

저장하시고 터미널에서 node_modules를 제거합니다.

다시 터미널에 npm install 합니다.

설치가 완료되면 다시 터미널에 npm run start

이렇게 진행하고 나오는 오류를 전달부탁드립니다 :grin:

7

react-scripts 버전을 4.0.3으로 사용을할경우에는 아예 실행조차 되지않습니다…ㅠ

image
image1920×1134 265 KB

image
image1768×1428 178 KB

8

안녕하세요.

먼저 질문에 대답을 드리기전에 궁금하신 내용 혹은 발생한 에러에 대한 해결법이 있는지 검색을 해보셨는지요?

살펴보니 webpack과 관련된 문제로 보이는데, 이미 webpack과 관련된 문의가 많이 올라왔었고 담당자가 대응했던 것으로 알고 있습니다.

caver-js의 repo에도 webpack관련된 에러가 발생 시 어떻게 하면 되는지 가이드를 하고 있습니다.

참고 부탁드리겠습니다.

2개의 좋아요
9

보내주신 내용에서

아래와 같이 진행해보니 정상적으로 caver-js를 사용할 수 있음을 확인했습니다.

아래 내용으로 확인 부탁드리겠습니다.

✗ rm package-lock.json
✗ rm -r node_modules
✗ npm install webpack@4.44.2
✗ npm run start
1개의 좋아요
10

답변 정말 감사합니다. :+1:
위에 답변해주신분을 보고 다시 해결해보겠습니다!!

11

안녕하세요 동일 오류로 문제를 겪고 있습니다.
혹시 해결 하셨다면 최종 어떤 방법으로 해결 하셨는지 알 수 있을까요?

12

제가 이거 해결했는데

node_modules > react-script > webpack.config.js 보시면 resolve 쪽이 있습니다. 거기에 fallback{ }, 넣으시고 저기 에러 뜬 내용들 하나씩 모두 추가하시면 해결 됩니다.
즉,
resolve : {
fallback : {
“fs” : false ,
“http”: require.resolve(“stream-http”),
“https”: require.resolve(“https-browserify”), …

}
}
이런식으로 오류나는 거 모두 추가해 주시면 됩니다. 이후에도 xh2-cookie 관련 오류가 난다면 npm i로 설치를, 그래도 안된다면 node_modules , package-lock.json 삭제 후 재설치 와 위의 webpack.config 파일 수정하시면 됩니다

13

웹팩이 버전 5으로 업데이트 되면서 저렇게 하나씩 추가해주어야 로드됩니다.

14

npm install 이후 (https-browserify, url)
node_modules > react-script > config > webpack.config.js 수정해서 해결했습니다.
감사합니다.

15

node는 생 초짜라 계속 환경 구성을 못하고 있었습니다.
그래도 해야 하다 보니 …

caver-js@1.6.7 설치 하고 한참 삽질 했었는데,
위엣 분이 남겨주신 글 보고서

  1. webpack@4.44.2 로 설치하고 나서,
  2. webpack.config.js 파일에서
  node: {
    fs: 'empty'
  },

했더니 돌기 시작하네요.

고맙습니다.

1개의 좋아요