Vue 3 support about blitzar HOT 27 CLOSED

Thanks guys. I will try to host the new docs and release beta version this week. BlitzForm and BlitzListForm are already done and usable in beta in Vue 3 projects.

from blitzar.

Finished BlitzForm and BlitzListForm.

Now working on BlitzTable. Looking at vue-dataset and vuejs-smart-table.

from blitzar.

I'm anxious to use in quasar v2, thanks from Brazil.

from blitzar.

Thanks, Luca. I'm using BlitzTable in a new Quasar project and had to drop back to v1 because this library is helpful enough to make it worth doing that. Personally, I'd rather see it working with QForm and QTables than wait for the non-Quasar refactoring.

from blitzar.

I was able to deploy the docs for Vue 3 here:
https://blitzar-next.web.app/blitz-form/

You can install the Vue 3 compatible BlitzForm by

npm i @blitzar/form@next

and use it according to the new docs.

Also check out the breaking changes documented in the first post of this thread.

I will continue to update here once I make progress hosting the new docs and also updates on the Vue 3 compatible BlitzTable.

from blitzar.

Is there an estimate on when this might be available? Or, alternatively, any insight into what needs to be done to migrate to Vue 3?

from blitzar.

This is a great question!

Currently Blitzar uses QForm and QTable under the hood.
I plan to make the library way more Framework Agnostic by removing the dependencies on QForm and QTable.

I have nothing against QForm and QTable, but the issue is: using those as dependency introduces a lot of global CSS pollution in projects. So currently it's really annoying when using Blitzar in Non-Quasar projects...

Planned steps:

• Remove QForm dependency
• Remove QTable dependency

Upgrading to Vue3:

• If Quasar upgrades to Vue 3 before I remove the dependencies, I can make the upgrade to Vue 3 on beforehand.
• If I am able to remove the dependencies before Quasar upgrades to Vue 3, I can make the upgrade to Vue 3 myself.

from blitzar.

I do not mind the QForm and QTable dependencies; Quasar v2 beta appears to be very stable and I am using Quasar for my application. So my preference is for movement to Vue 3 first. I looked at the Blitzar code and thought that there would not be too many changes but I was not confident in my doing it myself.

from blitzar.

@Peter-Gabel the thing is, I rather wait until Quasar's official Vue 3 release.
If you want to help out and try using the current Quasar Vue 3 beta, you can help me out on a new branch. Do you want to try?
We can have a short zoom session if you'd like where I show you how to best do it if you're still new to contributing on Github.

from blitzar.

Yes. I'd love to get right on it but it will take me about a week to find the time in my schedule. If you could propose when might be convenient for you, I would be grateful for guidance including any insights that you could share about migrating the code to Vue 3. I'm still getting up to speed on Vue 3 - I keep dropping into Vue 2 idioms and then need to remind myself of the differences. I am in the eastern US time zone but can be very flexible.

from blitzar.

what's your discord tag?

from blitzar.

@mesqueeb Seeing as quasar already updated to Vue3, is there any issue updating now?

from blitzar.

@Am3ra I will do my best to try to find the time to work on it!! Your support is much appreciated! : )

from blitzar.

ps: WIP on this branch
https://github.com/CyCraft/blitzar/tree/v1.0.0

from blitzar.

Loving what I'm seeing so far with Blitzar.
Looking forward to the updates to support the latest version of Quasar.

from blitzar.

I was able to deploy the docs for Vue 3 here:
https://blitzar-next.web.app/blitz-form/

from blitzar.

@WaltiDev did you globally register CodeBlock?

from blitzar.

I think yes: My "quasar boot file" has filename "blitzar.js" and is located in the /src/boot/ folder.
_import { boot } from 'quasar/wrappers'
import { BlitzForm } from '@blitzar/form'

export default boot(async ({ app }) => {
app.component('BlitzForm', { BlitzForm })
app.component('CodeBlock', { BlitzForm })
})_

And in quasar.conf.js I added "blitzar" into boot:
boot: [
'blitzar'
],

**Now I get the warning:**
_[Vue warn]: Component is missing template or render function. at <BlitzForm schema= Array [ {…}, {…} ] modelValue= Object {  } onUpdate:modelValue=fn  ... >_ 

from blitzar.

your code seems wrong.

First of all, you need to globally register BlitzForm like so:

• ✅ correct: app.component('BlitzForm', BlitzForm)
• ❌ wrong: app.component('BlitzForm', { BlitzForm })

And second of all, I think you have a typo for CodeBlock. Where are you getting this component from?

• ✅ correct: app.component('CodeBlock', CodeBlock) (but you need to import it from somewhere)
• ❌ wrong: app.component('CodeBlock', { BlitzForm })

I hope that helps!

PS: for more assistance with this, please open a new issue. I wanna keep this thread clean and only about upgrading the Blitzar source code.

from blitzar.

Hi,

Is there a timeline for when BlitzTable will work with Vue 3?
I migrated to quasar v2 recently and would love to implement Blitzar.

from blitzar.

@phineas629 yes I've been working on it this week and hopefully have something out next week.

from blitzar.

@mesqueeb sweet!
I really want to try Blitzar out.
If it's a fit then you got my support.

from blitzar.

I have released the official Vue 3 Blitzar! 🎉

• See new docs:
  https://blitzar.cycraft.co/

Will continue to improve Blitzar heavily into 2022.

Blitzar does not use Quasar anymore and is now usable with any Vue framework.

(still need to test SSR and Nuxt though, might not be compatible with SSR just yet)

from blitzar.

from blitzar.

To everyone here:
Vue 3 release of Blitzar is getting quite stable! Closing this issue for now.

I still plan to:

• create a framework example for Quasar, Nuxt, ...

Let me know if anything's up!

_{--
Blitzar was made with 💜 by Luca Ban.
You cannot sponsor every project, but next time you do, think of this one for its prolonged maintenance.}

from blitzar.

from blitzar.

Is continued support for Blitzar still ongoing?

from blitzar.