jquerylaravelnpm

How to use JQuery in Laravel (NPM)


Im new to web development and I work with the Laravel framework. I use npm for handling with packages. But now I have a problem to implement JQuery. Bootstrap is implemented to larval and it works

<link rel="stylesheet" href="/css/app.css">

In my Laravel project is in the package.json

 "devDependencies": {
    "axios": "^0.15.3",
    "bootstrap-sass": "^3.3.7",
    "cross-env": "^3.2.3",
    "jquery": "^3.1.1",
    "laravel-mix": "0.*",
    "lodash": "^4.17.4",
    "vue": "^2.1.10",
    "webpack": "2.2.1"
  }

Does that mean that Jquery is already in my project? But how looks the link like above from Bootstrap for jquery. For Bootstrap I have to compile new code (npm run dev) have I to do the same for Jquery?


Solution

  • Just had a look at this for a laravel 10 project with jetstream livewire these are the steps I took to get jQuery working: open windows terminal npm install jquery added './node_modules/jquery/**/*.js' to tailwind.config.js added 'node_modules/jquery/dist/jquery.min.js', to vite.config.js then added this to my head tag @vite('node_modules/jquery/dist/jquery.min.js?commonjs-entry') finally I added import jQuery from 'jquery'; window.$ = window.jQuery = jQuery; to bootstrap.js in resources/js this added jQuery.