Open brlocky opened 1 year ago
I just created another project only react without SWC, and still have the same issue.
npm create vite@latest
This is a clean installation of React using Vitejs.
https://stackblitz.com/edit/vitejs-vite-mbxbcc?file=package.json,src%2FApp.tsx&terminal=dev
@tiagosiebler this is probably a issue with vitejs configuration but would be great to have it working.
This is a clean installation of React using Vitejs.
https://stackblitz.com/edit/vitejs-vite-mbxbcc?file=package.json,src%2FApp.tsx&terminal=dev
@tiagosiebler this is probably a issue with vitejs configuration but would be great to have it working.
This is useful, not done much experimentation with my SDKs in frontend projects but I do want to ensure it's working, so this gives me something to test with. It's probably dependencies that don't exist in the frontend, such as the event emitter. Will try to investigate this week.
Hey @brlocky - made some progress here: https://stackblitz.com/edit/vitejs-vite-z7eqj9?file=package.json,vite.config.ts&terminal=dev
Using the guidance from here: https://github.com/tiagosiebler/bybit-api/issues/258
Currently stuck on an exception from another dependency: "bybit-api.js?v=b7e7f7cf:1439 Uncaught TypeError: Cannot read properties of undefined (reading 'from')"
bybit-api.js?v=b7e7f7cf:1439 Uncaught TypeError: Cannot read properties of undefined (reading 'from')
at node_modules/safe-buffer/index.js (bybit-api.js?v=b7e7f7cf:1439:17)
at __require (chunk-RSJERJUL.js?v=90874dba:3:50)
at node_modules/randombytes/browser.js (bybit-api.js?v=b7e7f7cf:1496:19)
at __require (chunk-RSJERJUL.js?v=90874dba:3:50)
at node_modules/crypto-browserify/index.js (bybit-api.js?v=b7e7f7cf:37236:84)
at __require (chunk-RSJERJUL.js?v=90874dba:3:50)
at node_modules/bybit-api/lib/util/node-support.js (bybit-api.js?v=b7e7f7cf:37339:20)
at __require (chunk-RSJERJUL.js?v=90874dba:3:50)
at node_modules/bybit-api/lib/util/BaseRestClient.js (bybit-api.js?v=b7e7f7cf:37386:26)
at __require (chunk-RSJERJUL.js?v=90874dba:3:50)
This is silly though...if I check the dependencies in this SDK for where safe-buffer is coming from, it's only dev dependencies:
$ npm ls safe-buffer
bybit-api@3.7.0 /Volumes/Repositories/Public/Trading/exchanges/bybit-api
+-- ts-jest@27.1.5
| `-- @babel/core@7.14.6
| `-- convert-source-map@1.8.0
| `-- safe-buffer@5.1.2
+-- ts-loader@8.0.14
| `-- enhanced-resolve@4.3.0
| `-- memory-fs@0.5.0
| `-- readable-stream@2.3.7
| +-- safe-buffer@5.1.2
| `-- string_decoder@1.1.1
| `-- safe-buffer@5.1.2 deduped
`-- webpack@5.76.0
`-- terser-webpack-plugin@5.3.9
`-- serialize-javascript@6.0.1
`-- randombytes@2.1.0
`-- safe-buffer@5.2.1
Why is vite trying to build dev dependencies into the frontend module?
Hey @brlocky - made some progress here: https://stackblitz.com/edit/vitejs-vite-z7eqj9?file=package.json,vite.config.ts&terminal=dev
Using the guidance from here: #258
Currently stuck on an exception from another dependency: "bybit-api.js?v=b7e7f7cf:1439 Uncaught TypeError: Cannot read properties of undefined (reading 'from')"
bybit-api.js?v=b7e7f7cf:1439 Uncaught TypeError: Cannot read properties of undefined (reading 'from') at node_modules/safe-buffer/index.js (bybit-api.js?v=b7e7f7cf:1439:17) at __require (chunk-RSJERJUL.js?v=90874dba:3:50) at node_modules/randombytes/browser.js (bybit-api.js?v=b7e7f7cf:1496:19) at __require (chunk-RSJERJUL.js?v=90874dba:3:50) at node_modules/crypto-browserify/index.js (bybit-api.js?v=b7e7f7cf:37236:84) at __require (chunk-RSJERJUL.js?v=90874dba:3:50) at node_modules/bybit-api/lib/util/node-support.js (bybit-api.js?v=b7e7f7cf:37339:20) at __require (chunk-RSJERJUL.js?v=90874dba:3:50) at node_modules/bybit-api/lib/util/BaseRestClient.js (bybit-api.js?v=b7e7f7cf:37386:26) at __require (chunk-RSJERJUL.js?v=90874dba:3:50)
This is silly though...if I check the dependencies in this SDK for where safe-buffer is coming from, it's only dev dependencies:
$ npm ls safe-buffer bybit-api@3.7.0 /Volumes/Repositories/Public/Trading/exchanges/bybit-api +-- ts-jest@27.1.5 | `-- @babel/core@7.14.6 | `-- convert-source-map@1.8.0 | `-- safe-buffer@5.1.2 +-- ts-loader@8.0.14 | `-- enhanced-resolve@4.3.0 | `-- memory-fs@0.5.0 | `-- readable-stream@2.3.7 | +-- safe-buffer@5.1.2 | `-- string_decoder@1.1.1 | `-- safe-buffer@5.1.2 deduped `-- webpack@5.76.0 `-- terser-webpack-plugin@5.3.9 `-- serialize-javascript@6.0.1 `-- randombytes@2.1.0 `-- safe-buffer@5.2.1
Why is vite trying to build dev dependencies into the frontend module?
that "from" smells buffer !
Thank you for your super investigation, I'll dig into other projects where i did had to add some alias, and now that i saw your test, i remembered to be something with crypto and buffers, I'll have a look latter on !
Interesting, I think I should start including the ts files with the published package. Seems when importing the ts resources directly, there's more control over what dependencies are pulled in and what modules are swapped for browser usage.
Looks like I've gotten it working - let me publish a beta release of this SDK which includes the src/*ts files, and then we can see what else needs to be done to get this working properly with full type support!
@brlocky this seems to work: https://stackblitz.com/edit/vitejs-vite-z7eqj9?file=package.json,vite.config.ts,src%2FApp.tsx&terminal=dev
I've had to include src/*ts in the beta version of the package. However, I'm not sure if this is the correct approach to properly support modern frontend projects and I'm sure there's a lot to improve (perhaps also in the way the package.json is configured for the SDK). Would love some help here, as I'm less experienced in the frontend space.
Also note, I've had to add a buffer polyfill, but this seems weird as the only dependencies using buffer are dev dependencies from the SDK (such as ts-jest), which absolutely should not be included in the browser bundle. Also haven't tested websockets as I suspect that will need more changes for browser support (especially since EventEmitter is another nodejs package)
I have it working locally, only changing the import,
import { RestClientV5 } from 'bybit-api/lib/rest-client-v5';
with version
"bybit-api": "^3.7.0",
without need to change the Vite setup.
https://stackblitz.com/edit/vitejs-vite-qybfvu?file=vite.config.ts,package.json,src%2FApp.tsx.
Also note, I've had to add a buffer polyfill, but this seems weird as the only dependencies using buffer are dev dependencies from the SDK (such as ts-jest), which absolutely should not be included in the browser bundle. Also haven't tested websockets as I suspect that will need more changes for browser support (especially since EventEmitter is another nodejs package)
I would think theres somehow a issue in the build, where js and ts are not having same exports. I spent sometime tweaking your build, but without success.
I have it working locally, only changing the import,
import { RestClientV5 } from 'bybit-api/lib/rest-client-v5';
with version
"bybit-api": "^3.7.0",
without need to change the Vite setup.
https://stackblitz.com/edit/vitejs-vite-qybfvu?file=vite.config.ts,package.json,src%2FApp.tsx.
oh interesting, so including the ts resources isn't necessary after all?
I have it working locally, only changing the import,
import { RestClientV5 } from 'bybit-api/lib/rest-client-v5';
with version"bybit-api": "^3.7.0",
without need to change the Vite setup. https://stackblitz.com/edit/vitejs-vite-qybfvu?file=vite.config.ts,package.json,src%2FApp.tsx.oh interesting, so including the ts resources isn't necessary after all?
Yup, I deleted node_modules a few times to ensure i was having the right result, but looks to be working fine only changing the import
Hi!
Thanks for your investigation @brlocky @tiagosiebler . Changing the import solves indeed the issue for RestClientV5 but not WebsocketClient ..
Here is RestClientV5 working (same as you) :
import { RestClientV5 } from 'bybit-api/lib/rest-client-v5';
https://stackblitz.com/edit/vitejs-vite-bz4zxl?file=vite.config.ts,src%2Findex.css,src%2FApp.tsx
> working fine
Here is the exact same but with
import { WebsocketClient } from 'bybit-api/lib/websocket-client';
https://stackblitz.com/edit/vitejs-vite-nmbh2z?file=vite.config.ts,src%2Findex.css,src%2FApp.tsx
we have this error again :
Uncaught TypeError: Class extends value undefined is not a constructor or null at node_modules/bybit-api/lib/websocket-client.js (chunk-JBAS62RK.js?v=c98416ad:5320:50) at __require (chunk-RSJERJUL.js?v=c98416ad:3:50) at bybit-api_lib_websocket-client.js?v=c98416ad:5:16
I don't know at all how to fix if you can help...
Hi!
Thanks for your investigation @brlocky @tiagosiebler . Changing the import solves indeed the issue for RestClientV5 but not WebsocketClient ..
Here is RestClientV5 working (same as you) :
import { RestClientV5 } from 'bybit-api/lib/rest-client-v5';
https://stackblitz.com/edit/vitejs-vite-bz4zxl?file=vite.config.ts,src%2Findex.css,src%2FApp.tsx> working fine
Here is the exact same but with
import { WebsocketClient } from 'bybit-api/lib/websocket-client';
https://stackblitz.com/edit/vitejs-vite-nmbh2z?file=vite.config.ts,src%2Findex.css,src%2FApp.tsxwe have this error again :
Uncaught TypeError: Class extends value undefined is not a constructor or null at node_modules/bybit-api/lib/websocket-client.js (chunk-JBAS62RK.js?v=c98416ad:5320:50) at __require (chunk-RSJERJUL.js?v=c98416ad:3:50) at bybit-api_lib_websocket-client.js?v=c98416ad:5:16
I don't know at all how to fix if you can help...
for production, you have to do npm i events and move that events folder to your local bybit-api/node_modules/ directory for dev, just use webpack bundle
Hi all, I started a new ReactJS project with Vite + SWC, but i'm having some weird issues, maybe someone can help me. I have the exact same provider in an older react project and its working fine
So this is the error message on the console
Currently testing with provider but already tested in the component, same result