refactor: vite for kv-components

[emuvente]

Started doing this so that KvFlag and the flag svgs could be transpiled in the library, avoiding the need for UI or CPS to handle it. Still WIP.

TODO

• import flag svg as needed instead of embedding all urls in css
• fix package exports definitions

[mcstover]

What creates the need to have a folder and additional index for every component? Is there a way around that?

I can see the usefulness of synchronizing within this repo with or without the .vue extension but this still leaves a .vue usage for each component import in the index files. Could we just skip having to change that everywhere and allow .vue extensions in vite and eslint.

We could also look at using an alias in vite to resolve without a relative path...something like #components/MyComponent instead of ../../... It would of course also require a bunch file updates to implement... 🤷

[emuvente]

What creates the need to have a folder and additional index for every component? Is there a way around that?

This structure is from a guide for component libraries I was following. Each index is an entry point for the library. It allows individual fully-built components to be used without depending on the rest of the library and without needing an additional build step. We can also use those individual index files to inject type definitions, if/when we add typescript to this. If we use just the top-level index file, we might not get tree-shaking with the output and it might be harder to add type definitions. I'm still testing the consumer side of this setup, and I'll change it if I can.

We could also look at using an alias in vite to resolve without a relative path...something like #components/MyComponent instead of ../../... It would of course also require a bunch file updates to implement... 🤷

Yeah, that's a good idea. I probably should have started with that. Find & replace will make easy work of it at least