Litepicker icon indicating copy to clipboard operation
Litepicker copied to clipboard

Window is not defined in Inertiajs + Vue + Vite

Open kurtobando opened this issue 2 years ago • 0 comments

Describe the bug

Hello author, I would like to know how would we setup Litepicker in Inertiajs + Vue + Vite? So far; i can't figure out how to make it work from this doc;

https://litepicker.com/docs/examples#how-to-add-litepicker-to-nuxtjs-

  • In Inertiajs + Vue + Vite, there is no nuxt.config.js, to continue adding these lines below;
plugins: [
  { src: '~/plugins/litepicker.js', mode: 'client' }
],

To Reproduce

...
"litepicker": "^2.0.12",
...
import Litepicker from 'litepicker';
...
setup() {
        ...
        onMounted(() => {
            if (typeof window !== 'undefined') {
                new Litepicker({
                    element: document.getElementById('birthdate'),
                    maxDate: new Date(),
                    dropdowns: { minYear: 1800, maxYear: null, months: false, years: true },
                    setup: (picker) => {
                        picker.on('selected', (date) => {
                            form.birth_date = date.format('YYYY-MM-DD');
                        });
                    },
                });
            }
        });
        ...
}

SSR returns;

node bootstrap/ssr/ssr.mjs
ReferenceError: window is not defined|
ReferenceError: window is not defined
    at file:///home/user/project/bootstrap/ssr/assets/TheComponent.64e27b8a.mjs:36:5

image

Any recommendation on how to go about this?

kurtobando avatar Jan 10 '23 07:01 kurtobando