Build Quasar component library

[jigarzon]

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.

[s.molinari]

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

[jigarzon]

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)

[Allan-EN-GB]

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.