Interface mismatch with @riotjs/compiler

karak commented 5 years ago

The output of comile in "@riotjs/compiler" looks to mismatch with define in this package to me.

Could you tell me the total image to define custom elements in riot@4?

My current idea is like below:

const { code, map } =  await compile(source);

const xTag = evaluateModuleSomeway(code);

const { css, template, tag } = xTag;

define('x-tag', {
  css: css, // GOOD!,
  tmpl: template, // BAD! template is a function compiled, while tmpl requires source string.
  props: [], // BAD! Riot tags never tell us about them.
  data() {}, // BAD! The Compiler never returns the initial attributes part.
  ...tag, // GOOD! But where should we put the codes outside `export default`?
});

BTW, riot-compiler v3 with "entities" option is almost perfect, except we must manage to make props from attributes part of root element -- yes, it limits attributes to observe, but I believe this is the only way to select them.

EDIT: I fixed the example. My real code is here: https://github.com/karak/riot-web-components/blob/compiler-v4/src/index.js

karak commented 5 years ago

My real code is here: https://github.com/karak/riot-web-components/blob/compiler-v4/src/index.js

I found the current @riotjs/custom-elements uses riot v3.X, naturally never working with compiler of v4! But what about the future?

GianlucaGuarini commented 5 years ago

Please just let me work, I didn't finish my work on riot@4 yet. I am designing a beautiful API that is compatible to any consumer: customElements, webpack, rollup.... I am closing this ticket because there is no bug here

riot / custom-elements

Interface mismatch with @riotjs/compiler #2