I tried to import ccxt into my svelte kit app and got ReferenceError: Buffer is not defined even though I'd only imported it

I have a minimal reproducible example here about this issue. The issue is that import ccxt from "ccxt" gives this error

ReferenceError: Buffer is not defined
    at node_modules/ccxt/js/static_dependencies/node-rsa/schemes/pkcs1.js (pkcs1.js:10:10)
    at __require (chunk-RSJERJUL.js?v=d0062138:3:50)
    at node_modules/ccxt/js/static_dependencies/node-rsa/schemes/schemes.js (schemes.js:2:12)
    at __require (chunk-RSJERJUL.js?v=d0062138:3:50)
    at node_modules/ccxt/js/static_dependencies/node-rsa/libs/rsa.js (rsa.js:12:15)
    at __require (chunk-RSJERJUL.js?v=d0062138:3:50)
    at node_modules/ccxt/js/static_dependencies/node-rsa/NodeRSA.js (NodeRSA.js:8:11)
    at __require (chunk-RSJERJUL.js?v=d0062138:3:50)
    at node_modules/ccxt/js/base/functions/crypto.js (crypto.js:8:17)
    at __require (chunk-RSJERJUL.js?v=d0062138:3:50)

steps to reproduce:

1. use the create a project steps
2. npm install ccxt
3. in the /src/routes/+page.svelte use import ccxt from "ccxt"

My expected behavior is that the package imports and I can do like what the docs say to do

var ccxt = require ('ccxt')

console.log (ccxt.exchanges) // print all available exchanges

i saw this post say basically "to get require to work, try adding it as a dev dependency" so i did that:

npm install --save-dev ccxt

require still fails. and anyway I don't want to use require, I want to use "import".

edit:

I managed to use Uncaught ReferenceError: Buffer is not defined to make my vite.config.js do this

import path from 'path'
import inject from '@rollup/plugin-inject'

import { sveltekit } from '@sveltejs/kit/vite';
import { defineConfig } from 'vite';

export default defineConfig({
	plugins: [sveltekit()],
	resolve: {
		alias: {
			'@': path.resolve(__dirname, 'src'),
		}
	},
	build: {
		rollupOptions: {
			plugins: [inject({ Buffer: ['buffer', 'Buffer'] })],
		},
	},
})

and now i can console.log(ccxt.exchanges) server side, but client side it still errors. but, progress.

edit2: I also tried the ticked answer to ReferenceError: Buffer is not defined in vite/sveltekit with Torus which says

resolve: {
                alias: {
                    '@toruslabs/openlogin': path.resolve(
                        './node_modules/@toruslabs/openlogin/dist/openlogin.umd.min.js'
                    )
                }
            }

but this fails as well.

I tried the answer by "Goutham J.M" with many upvotes that was long and complex, and got stuck with error [ERR_MODULE_NOT_FOUND]: Cannot find package '@esbuild-plugins/node-globals-polyfill' but I don't know how to solve that and it's too much of a rabbit hole.

Unfortunately, nodejs libraries (as opposed to browser or client-side libraries) like ccxt are not officially supported in client-side SvelteKit; they are only supported in server-side SvelteKit.

Generally, the best solution is to limit usage of nodejs libraries to server-side SvelteKit. This should be sufficient 99% of the time:

• Call the nodejs library from +page.server.js and return values from the load function. The values can be accessed from +page.svelte via the data prop.
• OR call the nodejs library from an API endpoint in +server.js. Then fetch() the appropriate internal API endpoint URL from +page.svelte (or almost anywhere else).

For the 1% of the time this is not sufficient, you will have to either polyfill nodejs built-in dependencies (Buffer) and/or remove nodejs dependencies from the library (ccxt) in question.

Sometimes polyfilling will get some nodejs libraries to work client-side. (Buffer is a nodejs built-in module):

1. To fix local dev errors.
2. To fix build-time errors.

However, it seems you have already tried polyfilling.