Vue3

[ngmiduc]

Does any tried that with VueJs3 ?

I am getting only : createElement is not a function when trying adding a styled component into the template.

[denvolynets]

will there be any work on this issue?

[liqueflies]

I think new api of vue 3 brings the h or createElement function outside the render scope:

https://v3.vuejs.org/guide/migration/functional-components.html#_3-x-syntax

It require maybe a version for vue 3 only.

[alexkharech]

https://github.com/UX-and-I/vue3-styled-components

[Blackfaded]

Are there any plans to support vue3 in the official library?

[Blackfaded]

Yes I know, but since we are developing a big size enterprise project I would be happy to use the official library

[liqueflies]

Hi @Blackfaded ,

since vue3 made a lot of breaking changes it will be necessary to create a next version of this package. At this moment I have no real experience with vue3 cause at work we still use te v2.

So maybe in the future, when my skills where ready to do that in the proper way, I'll try to update it. Maybe I can give it a try in these days but for sure it will not production-ready solution.

Open source (as license say) has also no warranty on software and if there are some updates, features, improvements from the community I will happy to merge the work into the official one.

If you want to give a try, refer to https://github.com/UX-and-I/vue3-styled-components. Is based on this package, but the vue component is written with vue3 API.

Thank you <3

[lloydjatkinson]

Hi,

Would funding/sponsorship help styled-components get first class support for Vue 3?

[exbotanical]

Hi @Blackfaded ,

since vue3 made a lot of breaking changes it will be necessary to create a next version of this package. At this moment I have no real experience with vue3 cause at work we still use te v2.

So maybe in the future, when my skills where ready to do that in the proper way, I'll try to update it. Maybe I can give it a try in these days but for sure it will not production-ready solution.

Open source (as license say) has also no warranty on software and if there are some updates, features, improvements from the community I will happy to merge the work into the official one.

If you want to give a try, refer to https://github.com/UX-and-I/vue3-styled-components. Is based on this package, but the vue component is written with vue3 API.

Thank you <3

Hi there. I think it would be a huge boon to the Vue community to have a fully-featured CSS-in-JS library (specifically with the Styled Components API). Mind if I take a stab at this? I'd like to see if I can get us back to the full feature-set of this library with Vue 3 support.

Thanks.

[lloydjatkinson]

@MatthewZito do you need any assistance? I’d like to help if I can

[exbotanical]

@MatthewZito do you need any assistance? I’d like to help if I can

Absolutely. I plan on doing the work in a fork of this repository - at least until we hear from @liqueflies on whether they want to continue this project or if we should continue with a new one altogether. I'll have it stood up on my account in a few - feel free to start a discussion over there so we can coordinate.

Quick note - it looks like the aforementioned Vue 3 fork has been inactive for almost 1 year. They also note this in the README:

"This is a very quick, as-is-port of vue-styled-components, meaning it will only provide the functionality we need, until vue-styled-components hopefully has found its own path to Vuejs 3"

That is, I believe it's safe to say they don't intend on implementing the remainder of the existing Vue 2 Styled Components API.

@liqueflies I don't want to step on your hard work here; if you feel there's a better direction please let us know.

Update: I'm almost finished with a full-parity update for Vue 3. Just need to wrap up some additional tests, update the examples and build steps. Will have a PR soon.

[exbotanical]

Thanks for being patient, everyone - I'm relocating across the country next week so life has been a bit all over the place.

@liqueflies I've opened a PR for Vue 3 support. Let me know if you'd prefer this be on a next branch. Thanks

139

[Szuumii]

Hello @MatthewZito! Any update regarding the issue?

[exbotanical]

Hello @MatthewZito! Any update regarding the issue?

I recently published this on my NPM account, as it seems this project is not being actively maintained and we haven't heard from the original author in quite some time.

Feel free to try it out!

There's a couple of issues with the TypeScript types that I'll be fixing later today, but thus far everything seems to be in working order. I think I'll continue working on this project under the forked repo on my account.

[mattvb91]

bump, any update for the official package for support?

[lloydjatkinson]

I don't think its happening. I offered to sponsor it's development, so it can't be a lack of funding.

I've since migrated to React where tooling/libraries/etc aren't just broken for years.

[mattvb91]

yea im coming the other direction, react -> vue and it does seem like the vue ecosystem is pretty dead on alot of packages

[lloydjatkinson]

A very painful direction indeed!

[exbotanical]

bump, any update for the official package for support?

Doubtful. I opened a PR to merge full Vue 3 support over a year ago and I never heard back from the maintainer. Even pinged him on LinkedIn. I've published the package on NPM but I'm also very busy and likely won't be working on it much beyond what I have right now (which is, at the least, full-parity support with the original package).

[liqueflies]

Hello people, I was notified about this conversation and I need to clarify what I have already answered above time ago.

I started to port SC from vue in 2018 (5 years ago!), using the core (with core I mean the logic behind the style and class computation, not the framework) of react SC at that moment.

That was a sort of self-challenge for me, I published the package under my name and I wrote to the creators of SC if this was good for them. They invited me to move my repo under the "styled-components" organization to get more visibility and help from the community.

After that, I started for each change from the core to bridge to vue SC but it was so painful, so I tried to ask if was possible to move the "core" into a separate package (from the main repo) and just create the "vue" component that uses the core logic.

Read here if interested: https://github.com/styled-components/styled-components/issues/588

I lost my potential time doing this and the community started to make fixes and PRs about vue SC and when it was possible I managed and merged.

Now I have no knowledge of vue3 to make this "reviewer" work, cause I moved to react too. I am sorry for the "no reply" but my last years were overwhelmed by my main work, and I want to start here to answer each one of you:

@lloydjatkinson No, I don't want to be founded. This is not my job and I do open source for passion! The "community" is not just people that "uses" software, but people collaborating and helping with that. I think the best way is to search for people who are involved to be "maintainers" of the package and let them guide the lib.

@exbotanical I am very sorry If I didn't reach out. I looked on Linkedin inbox but I didn't find you in my messages, what's your username/name there? Congrats on your work, I really want to say that I could review and merge but for the same reasons I wrote above, I am not comfortable with vue3. Maybe you are interested in being a maintainer? We can reach out to the org and ask them if this is ok?

In general: merging the PR from @exbotanical is the same as using its NPM package. Same code, same result. So my suggestion for now it's to use that package!

I think vue-styled-components will grow only if more people (not only one) take their time to actively maintain the repo. I am open to hearing something from you if interested, as I said for me the right way is to make a PR on the main repo only with the "vue" component into the monorepo. This is my suggestion and what I was trying to achieve before vue3, but at that time was not possible. I think maybe now the main repo should be pluggable, so maybe the work should be smaller than re-write everything. And yes of course If I can help let's discuss and I will try to do my best with the time I have.

Thank you for reading and understanding. Lorenzo

EDIT: updated monorepo conversation link

[exbotanical]

@exbotanical I am very sorry If I didn't reach out. I looked on Linkedin inbox but I didn't find you in my messages, what's your username/name there? Congrats on your work, I really want to say that I could review and merge but for the same reasons I wrote above, I am not comfortable with vue3. Maybe you are interested in being a maintainer? We can reach out to the org and ask them if this is ok?

Sorry! I must have been thinking of someone or something else because I double-checked my LinkedIn and didn't see any sent messages to you :laughing: My bad.

I'd be happy to co-maintain or guide a new maintainer if they'd like to use my fork. Let's see if anyone is interested and go from there. Great to hear from you, hope all is well.

[liqueflies]

@exbotanical I am very sorry If I didn't reach out. I looked on Linkedin inbox but I didn't find you in my messages, what's your username/name there? Congrats on your work, I really want to say that I could review and merge but for the same reasons I wrote above, I am not comfortable with vue3. Maybe you are interested in being a maintainer? We can reach out to the org and ask them if this is ok?

Sorry! I must have been thinking of someone or something else because I double-checked my LinkedIn and didn't see any sent messages to you 😆 My bad.

I'd be happy to co-maintain or guide a new maintainer if they'd like to use my fork. Let's see if anyone is interested and go from there. Great to hear from you, hope all is well.

To me the best way is to create a next branch and a next alpha version to test it out. Then the right way is to work into the main styled-components repository in order to not get mad with vue integration.

I will be unreachable till next week, when back I can make a next branch and npm version

[jonsalvas]

any updates here?

[akinoccc]

Hey there, wonderful people! I'm thrilled to share that I've revamped a version specifically tailored for Vue3. You can explore it right here: https://github.com/v-vibe/vue-styled-components. Plus, I've put together comprehensive documentation for your convenience: https://vue-styled-components.com/. Rest assured, I'm committed to nurturing and enhancing this repository for the long haul!