SPIKE: Simplify/clarify browser-based development

[ac10n]

What are the goals of the research?
Currently, simply adding the Taquito and Beacon packages to an app does not work. Developers need to polyfill the nodejs dependencies (like stream, util, buffer, etc) in the browser. This needs to be done before anything can be done. It would be great if there was a solution baked into Taquito, that users could simply use.

Imagine if there was a @taquito/browser, and including it would polyfill these dependencies.
If it's not possible to have one package for all frontend technologies, maybe having a separate one for important stacks, like @taquito/browser-react, and @taquito/browser-angular, and @taquito/browser-svelte could be the solution. However, that increases the number of packages we need to maintain.

Alternatively, we can have per-stack documentation of how to do this.

Describe the concrete outcomes of the research below. Can include questions/areas that need to be investigated/discussed
Acceptance criteria:
It should be completely straightforward for developers to start developing dApps. Facing early problems can deter potential adopters.

[BearCooder]

I believe a separation between stacks is not necessary. The important aspect or separation here is between the bundler e.g. Webpack and Vite. But not 100% sure.

I also think this would solve that issue #1528

The idea with having a @taquito/browser is great, I can only speak for myself that this issues cause for new devs many confusion and is a pain @AlirezaHaghshenas.
Although as first step an entry in the documentation on the website about this issue and how to solve it would be very helpful. The polyfill explanation in the Taquito Template Readme helped me a lot: https://github.com/ecadlabs/taquito-react-template

[lousando]

I arrived here as well after 2 days of debugging polyfill issues. As a library that's targeted towards FE development primarily, it seems that it's a second priority. I'm using Astro at the moment which is using Vite under-the-hood for what it's worth.

I'll take a look at the vite config that's been posted in order to get this working.

[lousando]

The polyfill example in the react repo worked; thanks! Please add this somewhere on the site for other folks using Vite.

[ac10n]

@lousando It's now in https://tezostaquito.io/docs/tutorial/#fixing-node-specific-dependencies-in-the-browser