UI extension with Single-File Component (SFC)



  • Hi,

    I’m trying to create UI components extension based on the official UI kit (quasar create my-ext --kit ui). As I see, the render function was used to define a template.

    I prefer to use a Single-File Component file (comp.vue), but when I try to import this, I get a syntax error because I didn’t define the template compiler. It’s easy in the webpack world, but I can’t see any webpack components.

    So How can I use the vue file in the official UI extension template?

    Thanks in advance!



  • @Marton You can look at this PR to add it. It’s been around for a while, so don’t think it will go in. https://github.com/quasarframework/quasar-starter-kit-ui/pull/19
    As for SFC vs Render functions, it took me a while to get used to them, but I would never go back. Components should be render functions and whatever consumes them should be SFC. There are things you can do in a render function that just can’t be done in a template without looking horrid and unreadable. Remember, HTML is not really a programming language. It’s a layout template. It should not be treated as a programming language.



  • Hi @Hawkeye64, Thank you for your fast reply. That’s what I was looking for.



  • @Marton Also, regarding render functions, you can debug them much easier than compiled template.


Log in to reply