DEV Community

jasuke-dev
jasuke-dev

Posted on

4 1

Add Tom Select to Laravel using Laravel MIX

This is how to add Tom Select package to youre laravel project

Installing Tom Select

Open terminal in youre laravel project and install the package

npm i tom-select
Enter fullscreen mode Exit fullscreen mode

Applying Tom Select JS

open /resources/js/app.js and add Tom Select js in there

window.TomSelect = require('tom-select')
Enter fullscreen mode Exit fullscreen mode

Applying Tom Select CSS

Tom Select functionality will not work with out the css file, add Tom Select CSS to /resources/css/app.css

...
@import '/node_modules/tom-select/dist/css/tom-select.default.css';
...
Enter fullscreen mode Exit fullscreen mode

There are many css file, select what you like

Build laravel mix

npm run development

Add app.js and app.css to blade file

Dont forget to add app.js and app.css from public folder

<link rel="stylesheet" href="{{ mix('css/app.css') }}">
<script src="{{ asset('js/app.js') }}" defer></script>
Enter fullscreen mode Exit fullscreen mode

Done Tom Select has been succesfully add to youre laravel project

Image of Docusign

🛠️ Bring your solution into Docusign. Reach over 1.6M customers.

Docusign is now extensible. Overcome challenges with disconnected products and inaccessible data by bringing your solutions into Docusign and publishing to 1.6M customers in the App Center.

Learn more

Top comments (0)

Billboard image

The Next Generation Developer Platform

Coherence is the first Platform-as-a-Service you can control. Unlike "black-box" platforms that are opinionated about the infra you can deploy, Coherence is powered by CNC, the open-source IaC framework, which offers limitless customization.

Learn more