Build js files do not handle dependencies properly

[montalvomiguelo]

Build js files do not handle dependencies properly when running archie build (collection).

Input vendors/cookie.js is imported from multiple sections/snippets

• sections/newsletter-popup/src/index.js
• snippets/newsletter-reminder/src/index.js

Output next.js will output:

• First, newsletter-reminder. Without importing cookie.js which will throw undefined errors.
• Then, newsletter-popup. With cookie.js imported and works as expected.

We need the next.js bundle to handle script dependencies correctly.

[montalvomiguelo]

It seems like the problem is that we are trying to load entrypoints via inject, which is not meant for that. With that approach, esbuild does not know how to handle shared dependencies and output them in the correct order @fleveillee

Plus esbuild does not generate a bundle from multiple entries out of the box.

https://github.com/archetype-themes/archie/blob/b932ad69a395b955eb60fd1ef91eb8c11e2cdc73/src/main/processors/javascript/EsbuildProcessor.js#L40

Alternate solutions

1. High lift (unreliable hack), Archie could build 1 entrypoint to use in esbuild. This entrypoint would load the modules the developer wants to install. This way esbuild will understand the dependencies and output them in the correct order.
2. ⭐️ Low lift (reliable), bundle JS with rollup which supports multiple entrypoints. It understands the dependencies from the entries and outputs them in the correct order. (See prototype #145)

cc @justinbansal