Build Quasar component library



  • Hi. I have been investigating this for a few weeks, and my conclusion is negative.
    I cannot build a component library with quasar to be distributed to plain Vue projects.

    Let’s say, a chat application built with Quasar, and allow any Vue project to include it as a library.

    I’ve tried to build this with quasar-cli and vue-cli. With vue-cli I had better success, but I couldn’t make the quasar styles injected without affecting the “host” app.

    Do you know guys if there is a plan to support this kind of uses? Do you think that there could be a workaround to make this work?
    Thanks a lot in advance

    PS: App Extension is not a possibility because it requires Quasar on the client project.



  • I’m not sure, but I think you could use the plug-in version of Quasar and build out a Vue plug-in with it, making Quasar a dependency of your plug-in. Have you thought about that?

    Scott



  • Thanks @s-molinari for replying. I used exactly that for the best approach I could make. But I still have the problem of the quasar styles. I’m not a webpack expert. I could inject the styles with:

    <style lang="stylus" scoped>
    @import('../../node_modules/quasar/src/css/index.styl')
    

    But not all the styles got injected and it doesn’t look good (because some styles are missing, don’t know why)


  • Admin

    I’ve had similar issues when injecting Quasar into a website using a Browser Extension. The thing is, Quasar assumes (and mostly - rightly so) that it’s the only app running on the page and therefore doesn’t scope a lot of the top level styles it uses.

    I did start looking into a custom loader to wrap all the CSS automagically but this was going to error prone and a lot of work.

    In short, it’s also something I’d like to raise internally but there can’t be any promises as to whether this would be resolved or not.


Log in to reply