type check failed for prop "calendar". Expected E, got Object. about dayspan-vuetify HOT 17 CLOSED

Thank you!

Luckily it's only a warning - but it looks like dayspan is being included twice in this project setup - it's being pulled into the dayspan-vuetify build files.

I'll clean it up and release a new version.

from dayspan-vuetify.

Webpack likes to package all dependencies into the built files - and it is not straight forward to exclude them.

Version 0.2.2 was published to NPM and I've test and verified that it is working fine now.

Feel free to open this back up if that is no longer the case @dnasir @kelvinau & @zzAutumn .

from dayspan-vuetify.

What does your JS file look like that calls Vue.use( DaySpanVuetify, ... ) ?

from dayspan-vuetify.

Are you doing something like this?

https://github.com/ClickerMonkey/dayspan-vuetify#full-example

from dayspan-vuetify.

(also, it's good to update to 0.2.1 - previous builds had some issues)

from dayspan-vuetify.

I am having the same error too. I follow your full example, but I make it into a component, with version 0.2.1.
And for Vue.use, that's how I do it:
Vue.use(DaySpanVuetify, { methods: { getDefaultEventColor: () => "#1976d2" } });

from dayspan-vuetify.

Can you add this

mounted() {
   window.console.log(this.calendar);
}

And take a screenshot of the output in the console?

from dayspan-vuetify.

Here they are:

from dayspan-vuetify.

Thanks looks good. Either there are two versions of Dayspan being loaded (it might be accidentally packaged in the build of this project - but I didn't have this issue with my latest project) or the Vue version you have doesn't support this type of property validation.

What version of Vue are you working with?

from dayspan-vuetify.

Vue 2.5.2, Vuetify 1.1.9, dayspan-vuetify 0.2.1
I even tried to create a fresh project with vue-init webpack, and yarn add vuetify dayspan-vuetify. Still got the same error.

from dayspan-vuetify.

Have spent half a day to debug this, but still don't have any clues of the issue.
console.log(Calendar.months() instanceof Calendar); returns True, but somehow when I pass Calendar.months() as a property, it becomes not an instance of Calendar anymore.

For a quick work-around on setting up the example (https://github.com/ClickerMonkey/dayspan-vuetify#full-example), you can simply not provide the property to ds-calendar-app, as its default is Calendar.months() already. savestate triggered by change event contains the latest calendar instance, so I can just do this:

from dayspan-vuetify.

If you can, share your code with me so I can try it out myself - it could be the way something is configured.

from dayspan-vuetify.

I'm getting the same error. Vue 2.5.17, Vuetify 1.1.9, dayspan-vuetify 0.2.1.
My configuration for the plugin is the same as the one in the example code. Here's what my main.ts file looks like.

import Vue from 'vue';
import App from './App.vue';
import router from './router';
import store from './store';
import './registerServiceWorker';
import Vuetify from 'vuetify';
import 'vuetify/dist/vuetify.min.css';
import 'material-design-icons-iconfont/dist/material-design-icons.css';
import DaySpanVuetify from 'dayspan-vuetify';
import 'dayspan-vuetify/dist/lib/dayspan-vuetify.min.css';
import AppComponents from '@/components';

Vue.config.productionTip = false;

Vue.use(Vuetify);
Vue.use(DaySpanVuetify, {
  methods: { getDefaultEventColor: () => "#1976d2" }
});
Vue.use(AppComponents);

new Vue({
  router,
  store,
  render: h => h(App)
}).$mount('#app');

And this is the component that will be using the calendar.

<template>
  <v-container fluid fill-height>
    <ds-calendar :calendar="calendar"/>
  </v-container>
</template>

<script lang="ts">
  import Vue from 'vue';
  import Component from 'vue-class-component';
  import { Calendar } from 'dayspan';

  @Component
  export default class BookingCalendar extends Vue {
    name = 'BookingCalendar';
    calendar = Calendar.months();

    mounted() {
      console.log(this.calendar)
    }
  }
</script>

Hope this helps.

from dayspan-vuetify.

If anyone could supply a zip of their project (or a minimal amount of code that still has the issue) that would help immensely!

I'm thinking it has something to do with webpack configuration.

from dayspan-vuetify.

I can send you mine, but it's really just a project created using the latest Vue CLI, via the GUI. I then added Vuetify and your calendar.

AFAIK the project doesn't have a webpack config file.

from dayspan-vuetify.

Here's a test app that demonstrates this problem. Built using the GUI that came with @vue/cli version 3.0.0-rc.10.

Hope this helps.

test-app.zip

from dayspan-vuetify.

I can confirm that this bug has been fixed. Awesome work!

from dayspan-vuetify.