search

vikejs / vike-vue

🔨 Vue integration for Vike
https://vike.dev/vike-vue
MIT License
38 stars 6 forks source link

fix & improve clientOnly() squashed commit #132

Closed brillout closed 3 months ago

brillout commented 3 months ago

I'll squash these changes to the squashed commit, change the commit message, force push to main, and release a new version.

feat: `clientOnly()` helper (#110, fix #82)

I changed my mind: this PR restores <ClientOnly> and adds a deprecation warning. (We introduced quite a lot of breaking changes recently.)

@pdanpdan You mentioned that the clientOnly() usage example can be made easier? I'll go ahead and merge this PR but we can simplify the example in a follow-up PR.

brillout commented 3 months ago

Squashed forced-pushed commit: https://github.com/vikejs/vike-vue/commit/c6bb074885a1e59630ed007b354f107ce814c68e.

(Squashed b2d27a9214fda476e5f8da74e2e30c31aee4a373 into d0b7a29492c2952e91ed4c27fb1c9c362d4be208.)

pdanpdan commented 3 months ago

You mentioned that the clientOnly() usage example can be made easier? I'll go ahead and merge this PR but we can simplify the example in a follow-up PR.

I tried to keep the on-screen example minimal:

const ClientOnlyCounter = clientOnly(() => import('../../components/Counter.vue'))
<ClientOnlyCounter>
  <template #fallback>
    <p>Loading...</p>
  </template>
</ClientOnlyCounter>

All the rest are tests/examples for various features. We can remove them if you want.

brillout commented 3 months ago

As you want; I didn't had a close look at these examples.

FYI it's now documented at https://vike.dev/clientOnly#vue.