Hello Loquela,
It seems like you're having an issue where jQuery UI is not recognizing the jQuery instance. This can happen if jQuery UI is imported before jQuery has been set up on the window object, or if there's a module resolution issue.
First, ensure that your app.js file is correctly setting up jQuery before importing any jQuery UI components. Your current setup looks correct, but let's try to enforce the order of execution by using dynamic imports:
import './bootstrap';
// Import jQuery and assign it to the window object
import $ from 'jquery';
window.$ = window.jQuery = $;
// Dynamically import jQuery UI components
import('jquery-ui/ui/widgets/datepicker.js').then(() => {
// Your code that depends on jQuery UI can go here
// For example, initializing a datepicker:
$(function() {
$("#datepicker").datepicker();
});
});
Next, let's address your vite.config.js file. The alias you've set up seems to be incorrect. You're trying to alias the string '$' to 'jQuery', but what you actually want to do is alias the module identifier 'jquery' to the jQuery npm package. Here's how you can fix the alias:
import { defineConfig } from 'vite';
import laravel from 'laravel-vite-plugin';
export default defineConfig({
plugins: [
laravel({
input: [
'resources/sass/app.scss',
'resources/js/app.js',
],
refresh: true,
}),
],
resolve: {
alias: {
'jquery': 'jquery/src/jquery' // Correct alias for jQuery
},
},
});
By using the correct alias, you ensure that any import of 'jquery' within your modules will resolve to the jQuery source file, which should be compatible with jQuery UI.
Make sure to restart your Vite server after making these changes to ensure that the new configuration is picked up.
If you continue to experience issues, you may also want to check if there are any other scripts or modules in your project that could be interfering with jQuery or jQuery UI. Additionally, ensure that you don't have multiple versions of jQuery being imported, as this can also cause conflicts.
I hope this helps resolve your issue! If you have any further questions or run into more issues, feel free to ask.