Add Select 2 package in Laravel using npm

There are two ways to include Select2 plugin in your laravel project, one is via including the CDN and another is via NPM i.e. node package manager.
I find handling the dependencies via NPM to be a better option. In this article let’s go through on how you can include Select2 plugin in your laravel project using NPM.

Step 1 : Install jquery and select2 via npm command, since jquery is no longer included in Laravel by default and it’s a dependency for select2.

npm i jquery
npm i select2

Step 2: Include javascript
Open the bootstrap.js file located at resources > js folder. And add following lines at the end

require('jquery');
require('select2');
$('select').select2();

Step 3: Include CSS

Open app.css file located at resources > css folder and add following select2 css

@import "~select2/dist/css/select2.css";

Step 4: Npm Run

Run the npm run dev or npm run prod to compile the changes. The output of select2 css and js will be added to your app.css and app.js files.

Thats about it.