Подскажите как правильно подключать jquery библиотеки в Laravel через Laravel Mix.
На данный момент в webpack.min.js
const mix = require('laravel-mix');
mix.js('resources/js/app.js', 'public/js')
.extract(['jquery', 'bootstrap', 'owl.carousel'])
.autoload({
jquery: ['$', 'global.jQuery',"jQuery","global.$","jquery","global.jquery"]
})
.sass('resources/sass/app.scss', 'public/css')
.sass('resources/sass/libs.scss', 'public/css/vendor.css')
.styles(['resources/css/main.css'], 'public/css/main.min.css')
if (mix.inProduction()) {
mix.version();
}
В packaje.json
{
"private": true,
"scripts": {
"dev": "npm run development",
"development": "cross-env NODE_ENV=development node_modules/webpack/bin/webpack.js --progress --hide-modules --config=node_modules/laravel-mix/setup/webpack.config.js",
"watch": "npm run development -- --watch",
"watch-poll": "npm run watch -- --watch-poll",
"hot": "cross-env NODE_ENV=development node_modules/webpack-dev-server/bin/webpack-dev-server.js --inline --hot --disable-host-check --config=node_modules/laravel-mix/setup/webpack.config.js",
"prod": "npm run production",
"production": "cross-env NODE_ENV=production node_modules/webpack/bin/webpack.js --no-progress --hide-modules --config=node_modules/laravel-mix/setup/webpack.config.js"
},
"devDependencies": {
"axios": "^0.19",
"bootstrap": "^4.5.2",
"cross-env": "^7.0",
"jquery": "^3.5.1",
"popper.js": "1.16.1",
"laravel-mix": "^5.0.5",
"lodash": "^4.17.20",
"resolve-url-loader": "^3.1.0",
"sass": "^1.15.2",
"sass-loader": "^8.0.0",
"vue-template-compiler": "^2.6.11"
},
"dependencies": {
"owl.carousel": "^2.3.4"
}
}
В итоге ошибка
Uncaught TypeError: $(...).owlCarousel is not a function
at HTMLDocument. (app.js:2768)
at mightThrow (vendor.js:8191)
at process (vendor.js:8259)
Подскажите, пожалуйста, как это реализовать правильно.