JS error can't access property "get", this.$wire is undefined

[akulmehta]

Have you searched through other issues to see if your problem is already reported or has been fixed?

Yes, I did not find it.

Did you read the documentation?

Yes, I did not find it.

Have you tried to publish the views?

Yes - I didn't work.

Is there an error in the console?

There is an error in the browser console:

PHP Version

8.2.12

PowerGrid

5.3.7

Laravel

10.43.0

Livewire

3.4.4

Alpine JS

3.13.5

Theme

Bootstrap

Describe the bug.

When using flatpickr and using field with datepicker filter, I get the error described above.

My app.js is as follows:

import * as bootstrap from 'bootstrap';
import * as Popper from '@popperjs/core';

import axios from 'axios';
window.axios = axios;

import Alpine from 'alpinejs'
window.Alpine = Alpine
Alpine.start()
import flatpickr from "flatpickr";
import './../../vendor/power-components/livewire-powergrid/dist/powergrid'
import './../../vendor/power-components/livewire-powergrid/dist/powergrid.css'

This has also been reported by another user in discussions #1229 but it seems to be for different reasons.

Any help or advice is appreciated.

To Reproduce...

1. Set app.js as described above and run npm run dev.
2. Create a table with a field filter of datepicker.
3. Check browser console.

Extra information

No response

[luanfreitasdev]

Hi @akulmehta, can you add Alpine.start() to the last line of the js?

No need import Alpine from alpinejs
https://livewire.laravel.com/docs/upgrading#accessing-alpine-via-js-bundle

[akulmehta]

Thanks - removing all Alpine from my app.js fixed it for me.