WebReflection / hyperHTML

A Fast & Light Virtual DOM Alternative
ISC License
3.06k stars 112 forks source link

hyperhtml-awesome? #343

Closed coreyfarrell closed 5 years ago

coreyfarrell commented 5 years ago

Do you have a place for listing modules that are loosely related / helpful to hyperhtml projects? I have a nice set of tools to support my hyperhtml based web applications. In addition to babel-plugin-remove-ungap:

babel-plugin-template-html-minifier

Able to run html-minifier on hyperHTML templates. It'll probably work just as well against lighterhtml though I haven't tested that yet.

babel-plugin-bare-import-rewrite

I use this with fastify-babel for a 'live from source' web server that rewrites ESM imports to use browser compatible import URL's.

Personally I also use this with rollup-plugin-babel instead of using rollup-plugin-node-resolve. Partly due to habit - I needed the ability to force use of the root node_modules as lit-html had chronic problems with duplicate dependencies while it was v0.x.

Someone else wrote express-transform-bare-module-specifiers for express servers.

vinyl-rollup

My builds use gulp + rollup + babel. This module helps me by making rollup output to a gulp stream with the ability to also include the bundled module sources in the gulp stream. This is helpful as for example it can copy node_modules/some-web-component/** to wwwroot/node_modules/some-web-component/ so additional assets are published at the expected URL.

babel-plugin-bundled-import-meta

If node_modules/some-web-component/index.js uses import.meta.url to calculate the actual path to node_modules/some-web-components/image.png, rollup does not compensate. This babel plugin rewrites references to import.meta.url so it points to the original location where it is expected that the additional assets (images and such) can be found. This plugin works well with vinyl-rollup when copyModules is enabled.

WebReflection commented 5 years ago

for the time being, a HELPERS.md file might be a good start.

Then I can find a place in the official documentation too, as section a part. https://github.com/viperHTML/viperhtml.github.io