feat: VueJS + NuxtJS support (#199) #293
Conversation
Co-authored-by: Vladislav Zimnikov <[email protected]>
|
The latest updates on your projects. Learn more about Vercel for Git ↗︎
|
|
A new canary is available for testing. You can install this latest build in your project with: pnpm add [email protected] |
|
@Mr0Bread -- created a branch for you, and kicked off a canary build. |
|
Cool, thanks |
|
@Mr0Bread It looks like it didn't actually publish the vue package. I think you need to add this to the "publishConfig": {
"access": "public"
}, |
|
So we actually need to change the workflow abit to make sure it's versioned properly: https://github.com/pingdotgg/uploadthing/blob/main/.github/canary-version.js Maybe we should change it so it loops over the entire packages folder (except config) |
🦋 Changeset detectedLatest commit: 6d0ea09 The changes in this PR will be included in the next version bump. This PR includes changesets to release 8 packages
Not sure what this means? Click here to learn what changesets are. Click here if you're a maintainer who wants to add another changeset to this PR |
|
@markflorkowski This branch is now part of this repo, not my fork. I'm not sure I'll be able to push into this branch |
If not, fork and open PRs against this branch @Mr0Bread |
|
A new canary is available for testing. You can install this latest build in your project with: pnpm add @uploadthing/[email protected]
pnpm add @uploadthing/[email protected]
pnpm add @uploadthing/[email protected]
pnpm add @uploadthing/[email protected]
pnpm add [email protected]
pnpm add @uploadthing/[email protected] |
docs/src/pages/nuxt.mdx
Outdated
| <ClientOnly fallback-tag="div" fallback="Loading..."> | ||
| <Uploader :config="{ endpoint: 'videoAndImage', onClientUploadComplete={() | ||
| => { alert("Upload Completed"); }} onUploadError={(error: Error) => { // | ||
| Do something with the error. alert(`ERROR! ${error.message}`); }} }" /> | ||
| </ClientOnly> |
There was a problem hiding this comment.
why does this have to be in a client-only block? is it not possible to SSR this and have the file config on first paint?
There was a problem hiding this comment.
This one have to be fixed. ClientOnly is no longer needed
Co-authored-by: Vladislav Zimnikov <[email protected]>
Add support for NuxtJS and VueJS
hookscomposables for VueJSUpdate:
Vue package with UploadButton is added. Currently, it has external dependency on VueUse and it's useFetch. Ideally, it should be replaced with something more lightweight
Since I've used
defineComponentfunction to create UploadButton component, I had to make single top-level prop that can be passed in component configSo everything else can be passed into config prop object
Example of usage in SFC:
Typesafety and autocomplete works as expected
Correct types in middleware
Issues present so far that has to be fixed:
@uploadthing/vueis not working. import from@uploadthing/vue/indexworks but first option is more preferableClientOnlyto work properly. Not sure how much of an issue it is thoughExample from FE