casbloem / vue-luxon

Easy use of datetime with Luxon in Vue
https://npmjs.com/package/vue-luxon
72 stars 8 forks source link

Unable to use with Vue 3? #21

Open zluiten opened 3 years ago

zluiten commented 3 years ago

I'm having issues using this component with Vue 3. Is that because Vue 3 is not supported?

Uncaught TypeError: Vue.prototype is undefined
    install main.js:28
    use runtime-core.esm-bundler.js:2945
    <anonymous> main.js:10
    js app.js:41
    __webpack_require__ app.js:2137
    checkDeferredModulesImpl app.js:3186
    x app.js:3199
    <anonymous> app.js:3206
    <anonymous> app.js:3207
main.js:28
    install main.js:28
    use runtime-core.esm-bundler.js:2945
    <anonymous> main.js:10
    js app.js:41
    __webpack_require__ app.js:2137
    checkDeferredModulesImpl app.js:3186
    x app.js:3199
    <anonymous> app.js:3206
    <anonymous> app.js:3207

Component configuration:

import { createApp } from 'vue'
import RootComponent from './App.vue'
import VueLuxon from 'vue-luxon/src/main'

createApp(RootComponent)
  .use(VueLuxon, {
    input: {
      zone: 'utc',
      format: 'iso',
    },
    output: 'short',
  })
  .mount('#app')
anli-xsigns commented 3 years ago

Yes, the plugin is only usable for vue 2 at the moment. If #20 would be resolved and it is licensed unter MIT I could rewrite to TS and vue 3 and make a PR.

I just realized that filters are removed from vue 3 (https://v3.vuejs.org/guide/migration/filters.html#overview) so it would make more sense to write a new plugin to keep things compatible.

iampapagray commented 1 year ago

@anli-xsigns This doesnt still work with Vue3 after 2 years??

casbloem commented 10 months ago

Its a Vue 2 package that was made as wrapper to use luxon in Filters in vue 2. In vue 3 filters are removed. You can just use the luxon package in vue 3 and assign it as a global prop.

However ill make a new version for Vue 3, to provide a global prop and a useLuxon function for setup api.

dnldsht commented 2 months ago

I've developed vue-lux, a library compatible with Vue 3 and Nuxt. It’s inspired by vue-luxon and aims to provide date parsing and formatting using Luxon for modern Vue projects.

Feedback or suggestions are welcome.