search

bitcoinjs / tiny-secp256k1

A tiny secp256k1 native/JS wrapper
MIT License
90 stars 55 forks source link

react app example fails to compile #60

Closed tylerchambers closed 2 years ago

tylerchambers commented 2 years ago

Tried locally, and in a fresh node docker container. Both produce the following:

root@6ece77020054:/tiny-secp256k1/examples/react-app# npm install
npm WARN deprecated urix@0.1.0: Please see https://github.com/lydell/urix#deprecated
npm WARN deprecated resolve-url@0.2.1: https://github.com/lydell/resolve-url#deprecated
npm WARN deprecated chokidar@2.1.8: Chokidar 2 will break on node v14+. Upgrade to chokidar 3 with 15x less dependencies.

added 643 packages, and audited 644 packages in 12s

34 packages are looking for funding
  run `npm fund` for details

28 vulnerabilities (10 moderate, 18 high)

To address issues that do not require attention, run:
  npm audit fix

To address all issues (including breaking changes), run:
  npm audit fix --force

Run `npm audit` for details.
npm notice 
npm notice New minor version of npm available! 8.0.0 -> 8.1.0
npm notice Changelog: https://github.com/npm/cli/releases/tag/v8.1.0
npm notice Run npm install -g npm@8.1.0 to update!
npm notice 
root@6ece77020054:/tiny-secp256k1/examples/react-app# npm start

> react-app@0.0.0 start
> webpack serve

ℹ ｢wds｣: Project is running at http://localhost:8080/
ℹ ｢wds｣: webpack output is served from /
ℹ ｢wds｣: Content not from webpack is served from /tiny-secp256k1/examples/react-app/dist
Browserslist: caniuse-lite is outdated. Please run:
npx browserslist@latest --update-db

Why you should do it regularly:
https://github.com/browserslist/browserslist#browsers-data-updating
✖ ｢wdm｣: asset bundle.js 3.42 MiB [emitted] (name: main)
orphan modules 3.6 MiB [orphan] 5855 modules
runtime modules 1.25 KiB 6 modules
built modules 2.92 MiB [built]
  modules by path ./node_modules/ 2.88 MiB
    javascript modules 2.87 MiB 292 modules
    json modules 12.7 KiB
      modules by path ./node_modules/browserify-sign/browser/*.json 2.23 KiB
        ./node_modules/browserify-sign/browser/algorithms.json 2.07 KiB [built] [code generated]
        ./node_modules/browserify-sign/browser/curves.json 162 bytes [built] [code generated]
      4 modules
  optional modules 120 bytes [optional] 8 modules
  ./index.js 31.9 KiB [built] [code generated]
  ../random-in-node/index.js 1.98 KiB [built] [code generated]
  util (ignored) 15 bytes [built] [code generated]
  util (ignored) 15 bytes [built] [code generated]

ERROR in ../random-in-node/index.js 2:0-48
Module not found: Error: Can't resolve '../../lib/index.js' in '/tiny-secp256k1/examples/random-in-node'
 @ ./index.js 9:0-54 147:17-25

ERROR in ./index.js 3:0-32
Module not found: Error: Can't resolve 'buffer' in '/tiny-secp256k1/examples/react-app'

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: { "buffer": require.resolve("buffer/") }'
    - install 'buffer'
If you don't want to include a polyfill, you can use an empty module like this:
    resolve.fallback: { "buffer": false }

ERROR in ./index.js 8:0-49
Module not found: Error: Can't resolve '../../lib/index.js' in '/tiny-secp256k1/examples/react-app'

ERROR in ./node_modules/browserify-sign/node_modules/safe-buffer/index.js 3:13-30
Module not found: Error: Can't resolve 'buffer' in '/tiny-secp256k1/examples/react-app/node_modules/browserify-sign/node_modules/safe-buffer'

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: { "buffer": require.resolve("buffer/") }'
    - install 'buffer'
If you don't want to include a polyfill, you can use an empty module like this:
    resolve.fallback: { "buffer": false }
 @ ./node_modules/browserify-sign/browser/index.js 1:13-42
 @ ./node_modules/crypto-browserify/index.js 39:11-37
 @ ../random-in-node/index.js 1:0-37 12:34-45 13:35-46 14:32-43 21:28-39 23:30-41
 @ ./index.js 9:0-54 147:17-25

ERROR in ./node_modules/hash-base/node_modules/safe-buffer/index.js 3:13-30
Module not found: Error: Can't resolve 'buffer' in '/tiny-secp256k1/examples/react-app/node_modules/hash-base/node_modules/safe-buffer'

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: { "buffer": require.resolve("buffer/") }'
    - install 'buffer'
If you don't want to include a polyfill, you can use an empty module like this:
    resolve.fallback: { "buffer": false }
 @ ./node_modules/hash-base/index.js 2:13-42
 @ ./node_modules/md5.js/index.js 3:15-35
 @ ./node_modules/create-hash/browser.js 3:10-27
 @ ./node_modules/crypto-browserify/index.js 4:21-58
 @ ../random-in-node/index.js 1:0-37 12:34-45 13:35-46 14:32-43 21:28-39 23:30-41
 @ ./index.js 9:0-54 147:17-25

ERROR in ./node_modules/readable-stream/lib/_stream_readable.js 46:13-37
Module not found: Error: Can't resolve 'buffer' in '/tiny-secp256k1/examples/react-app/node_modules/readable-stream/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: { "buffer": require.resolve("buffer/") }'
    - install 'buffer'
If you don't want to include a polyfill, you can use an empty module like this:
    resolve.fallback: { "buffer": false }
 @ ./node_modules/readable-stream/readable-browser.js 1:10-63
 @ ./node_modules/browserify-sign/browser/index.js 3:13-39
 @ ./node_modules/crypto-browserify/index.js 39:11-37
 @ ../random-in-node/index.js 1:0-37 12:34-45 13:35-46 14:32-43 21:28-39 23:30-41
 @ ./index.js 9:0-54 147:17-25

ERROR in ./node_modules/readable-stream/lib/_stream_writable.js 70:13-37
Module not found: Error: Can't resolve 'buffer' in '/tiny-secp256k1/examples/react-app/node_modules/readable-stream/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: { "buffer": require.resolve("buffer/") }'
    - install 'buffer'
If you don't want to include a polyfill, you can use an empty module like this:
    resolve.fallback: { "buffer": false }
 @ ./node_modules/readable-stream/readable-browser.js 4:0-55
 @ ./node_modules/browserify-sign/browser/index.js 3:13-39
 @ ./node_modules/crypto-browserify/index.js 39:11-37
 @ ../random-in-node/index.js 1:0-37 12:34-45 13:35-46 14:32-43 21:28-39 23:30-41
 @ ./index.js 9:0-54 147:17-25

ERROR in ./node_modules/readable-stream/lib/internal/streams/buffer_list.js 15:15-32
Module not found: Error: Can't resolve 'buffer' in '/tiny-secp256k1/examples/react-app/node_modules/readable-stream/lib/internal/streams'

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: { "buffer": require.resolve("buffer/") }'
    - install 'buffer'
If you don't want to include a polyfill, you can use an empty module like this:
    resolve.fallback: { "buffer": false }
 @ ./node_modules/readable-stream/lib/_stream_readable.js 72:17-58
 @ ./node_modules/readable-stream/readable-browser.js 1:10-63
 @ ./node_modules/browserify-sign/browser/index.js 3:13-39
 @ ./node_modules/crypto-browserify/index.js 39:11-37
 @ ../random-in-node/index.js 1:0-37 12:34-45 13:35-46 14:32-43 21:28-39 23:30-41
 @ ./index.js 9:0-54 147:17-25

ERROR in ./node_modules/ripemd160/index.js 2:13-37
Module not found: Error: Can't resolve 'buffer' in '/tiny-secp256k1/examples/react-app/node_modules/ripemd160'

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: { "buffer": require.resolve("buffer/") }'
    - install 'buffer'
If you don't want to include a polyfill, you can use an empty module like this:
    resolve.fallback: { "buffer": false }
 @ ./node_modules/create-hmac/browser.js 7:16-36
 @ ./node_modules/crypto-browserify/index.js 5:21-58
 @ ../random-in-node/index.js 1:0-37 12:34-45 13:35-46 14:32-43 21:28-39 23:30-41
 @ ./index.js 9:0-54 147:17-25

ERROR in ./node_modules/safe-buffer/index.js 2:13-30
Module not found: Error: Can't resolve 'buffer' in '/tiny-secp256k1/examples/react-app/node_modules/safe-buffer'

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: { "buffer": require.resolve("buffer/") }'
    - install 'buffer'
If you don't want to include a polyfill, you can use an empty module like this:
    resolve.fallback: { "buffer": false }
 @ ./node_modules/create-hmac/browser.js 5:13-42
 @ ./node_modules/crypto-browserify/index.js 5:21-58
 @ ../random-in-node/index.js 1:0-37 12:34-45 13:35-46 14:32-43 21:28-39 23:30-41
 @ ./index.js 9:0-54 147:17-25

ERROR in ./node_modules/safer-buffer/safer.js 5:13-30
Module not found: Error: Can't resolve 'buffer' in '/tiny-secp256k1/examples/react-app/node_modules/safer-buffer'

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: { "buffer": require.resolve("buffer/") }'
    - install 'buffer'
If you don't want to include a polyfill, you can use an empty module like this:
    resolve.fallback: { "buffer": false }
 @ ./node_modules/asn1.js/lib/asn1/base/buffer.js 5:15-45
 @ ./node_modules/asn1.js/lib/asn1/base/index.js 6:21-54 7:21-54
 @ ./node_modules/asn1.js/lib/asn1.js 8:12-34
 @ ./node_modules/parse-asn1/asn1.js 5:11-29
 @ ./node_modules/parse-asn1/index.js 1:11-28
 @ ./node_modules/browserify-sign/browser/sign.js 7:16-37
 @ ./node_modules/browserify-sign/browser/index.js 5:11-28
 @ ./node_modules/crypto-browserify/index.js 39:11-37
 @ ../random-in-node/index.js 1:0-37 12:34-45 13:35-46 14:32-43 21:28-39 23:30-41
 @ ./index.js 9:0-54 147:17-25

ERROR in ./node_modules/string_decoder/node_modules/safe-buffer/index.js 3:13-30
Module not found: Error: Can't resolve 'buffer' in '/tiny-secp256k1/examples/react-app/node_modules/string_decoder/node_modules/safe-buffer'

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: { "buffer": require.resolve("buffer/") }'
    - install 'buffer'
If you don't want to include a polyfill, you can use an empty module like this:
    resolve.fallback: { "buffer": false }
 @ ./node_modules/string_decoder/lib/string_decoder.js 26:13-42
 @ ./node_modules/cipher-base/index.js 3:20-59
 @ ./node_modules/create-hmac/browser.js 4:11-33
 @ ./node_modules/crypto-browserify/index.js 5:21-58
 @ ../random-in-node/index.js 1:0-37 12:34-45 13:35-46 14:32-43 21:28-39 23:30-41
 @ ./index.js 9:0-54 147:17-25

12 errors have detailed information that is not shown.
Use 'stats.errorDetails: true' resp. '--stats-error-details' to show it.

webpack 5.27.2 compiled with 12 errors in 6123 ms
ℹ ｢wdm｣: Failed to compile.
junderw commented 2 years ago

Can you try https://github.com/bitcoinjs/tiny-secp256k1/tree/feature/schnorr ?

junderw commented 2 years ago

I think the problem is you haven't built the project first, and also it looks like webpack is using a newer version than the one in package-lock, so try using npm ci for both the main project and examples.

From the root, first do

# install dependencies
npm ci
# Build wasm
make build-wasm
# Build JS
make build-js
# cd into react-app
cd examples/react-app
# Install deps using npm ci
npm ci
# Start
npm start
junderw commented 2 years ago

Please reopen if the above doesn't help. Thanks.