I’m looking for a framework to make reusable components for any frameworks. I was searching about inserting a standard webcomponent to an aurelia app, and I found this : https://github.com/aurelia/web-components
I have no idea what this tool is made to, I see this had not been updated since one year, but I love the description : “A plugin capable of transforming Aurelia components into standards-compliant Web Components.”
Is this working ? Where can I found some doc to use it ?
Yes, Aurelia provides exactly what you want. I would strongly advise you to start studying Aurelia, you will not regret it. We will be very pleased to have good programmers on our side.
But on the subject you are asking, the following resources are available:
Hey. It’s funny before some days I wrote a small blog article about webcomponents in Aurelia.
Important insight here is that it seem to be right now only possible to use native web components in Aurelia with the JSPM skeleton. This is because the aurelia-html-import-template-loader plugin only works with Systemjs.
Where we used native web components the setup looked like this. Right now we switched to Preact as the component layer because it has fewer trade offs.
PS: I also added a project which should be a working example.
I am also interested in the progress of the aurelia/web-components repo! It says it transforms Aurelia Components into standards-compliant Web Components. That’s exactly what I am looking for!
@fragsalat describes in his blogpost the other way around. How to use Webcomponents inside an Aurelia App.
And for Preact I need to have some kind of bootstrapper to handle the import and render calls. As stated on MDN
An existing Web Component can be used without writing code, simply by adding an import statement to an HTML page.
What is the Aurelia way for this? What is the roadmap for this repo? How can I participate?
Well you there are 2 scanerios - compiling Aurelia components into “standard” web components, and using “standard” web components inside Aurelia app.
As far as I understand, @hadrienl is concerned about the first one and I don’t know about any progress or docs available.
But the second one is quite easy. You don’t need any special stuff, or Aurelia processing. Simply place your components as you would if you haven’t used Aurelia and it should work. You can bind attributes if you want or project something inside your component’s element if you need.
As far as I recognized it, you have to respect some things. Instead of working with attributes you have to provide getter and setter for the properties becuase Aurelia bind to the instance directly instead of rendering the value to the DOM so that the attributeChangedCallback could handle the value.
Thank you for your answers. I’m interested in the two faces : creating webcomponents from aurelia codebase, but also importing webcomponents in a aurelia app. Maybe we should focus on the first part in this thread and open a new thread to learn how to integrate webcomponents in Aurelia (I’ll do it now because I failed).
So, for now, it’s not possible, but maybe in the future.
I started the transition to syncfusion native JS controls. I made my own wrapper for the control that I needed. Sadly their pure JS controls aren’t as feature complete as the jquery ones. I want to be done with Kendo