DEV Community

Discussion on: My Vanilla JavaScript Built-In Web Elements Collection

Collapse
 
felipperegazio profile image
Felippe Regazio • Edited

Hey Pacharapol, you added some nice points here.

Didnt added an interface to import/require. This is the next step (gonna do it this week). Each element is a class that is added using customElements.define(). Im thinking in export the already defined element (ready to use).

Once i add the import/require interface the Unpkg and Tree Shaking can be a next step.


About bundlers: I tried to keep it as simple as it could be, so i decided to use Gulp. Here is why:

I need to:

  1. Generate CSS files from SCSS code
  2. Run babel on the JS code to guarantee the max of compatibility
  3. Minify all the files
  4. Generate a bundle: .min JS and CSS single files.

With gulp i took 30 minutes to do it and wrote a "create" npm script to add new components. I didnt saw any benefit in add such complex thing as webpack to do some simple tasks at this point. Maybe webpack could give me some fun or freedom, as code the element in a single file (scss + js), i dont know. So i didnt overcomplicate the things.

Anyway, i could be wrong. Now i can scale the elements to a next step, and could be the points that you added. Thinking on the tree shaking, an interface to allow import/require and the package managers to add these elements, maybe webpack would be really useful.

I'd love to hear what you think about. Do you have any tips?
Thank you for your comment.