RFC: Moving to ESM modules

[chmelevskij]

Current configurator setup relies heavily on globally defined classes, functions, helpers etc. Currently it's all dependant on the order of script tags, which can be brittle and is hard to just jump in. But it runs in an environment which supports native esm modules. With minimal bundling needed. Also the build step involves copying and re-installing packages, which takes time.

My proposal is to move the whole application to ESM modules, enabling for better modularity and eventually improving build speeds. Even moving to tools like vitejs to have instantaneous development experience.

There was small PRs with this change, but general idea is to do what has been done in #2430 with the help tab. Where main.js will be module, and every tab will be migrated one by one, to use import() and have exported required variables.

Any global variable, function or other code, which should be part of the module, will be bolted on to window.<export> at the end of the file, but only if it doesn't make sense to just convert whole file/part to module.

Some high level tasks:

• [ ] move main.js to modules
• [ ] move every tab to modules, keeping the old globals attached to window where necessary.
• [ ] resolve all the circular dependencies.
• [ ] rethink tab cleanup logic, currently which relies on global TABS
• [ ] fix reliance on global values, make everything imported.

[github-actions[bot]]

This issue has been automatically marked as stale because it has not had recent activity. It will be closed if no further activity occurs within a week.

[chmelevskij]

Go away bot 😄 I'm working on it

[McGiverGim]

Pinned! ;)

[haslinghuis]

@chmelevskij is this done already :stuck_out_tongue: