Elm + Webcomponents output
- Dominant language
- TypeScript
- Stars
- 14.4k
- Forks
- 671
- PR merge metrics
- No merged PRs in 30d
Description
Hi this looks like a super useful project!
I would be interested in working on an output target aimed at integrating in Elm. This is somewhat challenging as Elm has a fairly radically different model than most of the existing targets for mitosis.
The ideal outcome is that most components could be compiled to pure Elm. To do this, there needs to be a reasonably good transpiration story from Typescript to Elm. [I've started prototyping this and it seems like it could work for a decent amount of relatively simple components](https://observablehq.com/@gampleman/typescript-subset-elm).
The fallback would then be to generate 2 files: a web component using the existing web component output + an Elm "interface" file that would reference and wrap that component. I would foresee this happening in 3 scenarios:
1. Basically whenever `ref` is used, as Elm has no such concept.
2. When the JS/TS code uses concepts that aren't well suited to compiling into Elm:
- heavy mutation
- DOM APIs
- importing random library code
3. When the typescript type information isn't good enough to allow sufficient analysis to transpile into Elm. This could alternatively throw an error. I suspect this wouldn't happen if compiling on the strictest TS settings (like forbidding `any`), but not sure how that's setup in Mitosis projects...
---
So, are there any docs for contributing code emitters? Also, looking at the JSON output, the code seems to get transformed into an imperative form. Is it possible to emit full on typescript AST with type information included?
Contributor guide
Research direction
Start by reading the JSON output and existing web component output paths mentioned in the issue, then locate the project's code-emitter contribution documentation or entry points. Determine whether the proposed Elm target should transpile components to pure Elm or generate an Elm interface around web components; done requires a documented approach and agreed scope.
Written by the indexing model from the issue text.
Assessment
- Tech stack
- typescript
- Domain
- compilers, web-dev
- Issue type
- Feature
- Difficulty
- 5/5
- Estimated time
- Over a week
- Activity status
- Stale
- Clarity
- Needs clarification
- Newbie friendliness
- 25/100