I am currently exploring the world of Laravel and npm, and I am facing challenges in integrating the Bootstrap Tags Input library into my application (just like any other npm-installed library).
It appears to be straightforward, but I seem to be overlooking something.
Here's what I have done:
Installed dependencies
λ npm i bootstrap-tagsinput
npm WARN [email protected] requires a peer of node-sass@^4.0.0 but none is installed. You must install peer dependencies yourself.
npm WARN [email protected] requires a peer of fibers@>= 3.1.0 but none is installed. You must install peer dependencies yourself.
...
λ npm install
npm WARN [email protected] requires a peer of node-sass@^4.0.0 but none is installed. You must install peer dependencies yourself.
npm WARN [email protected] requires a peer of fibers@>= 3.1.0 but none is installed. You must install peer dependencies yourself.
...
Linked the library to my source files
In my /resources/js/app.js file :
require('bootstrap-tagsinput/src/bootstrap-tagsinput');
I've tried different approaches like
, but it didn't yield better results.window.BootstrapTagsInput = require('bootstrap-tagsinput/src/bootstrap-tagsinput');
In my resources/css/app.scss file :
// Bootstrap-tagsinput
@import '~bootstrap-tagsinput/src/bootstrap-tagsinput.css';
@import '~bootstrap-tagsinput/src/bootstrap-tagsinput-typeahead.css';
In my resources/views/layout/app.blade.php :
<div id="app" class="h-100">
<input type="text" value="Amsterdam,Washington,Sydney,Beijing,Cairo" data-role="tagsinput" />
</div>
Compiled the code
npm run watch
DONE Compiled successfully in 4475ms 12:39:08 AM
Asset Size Chunks Chunk Names
/css/app.css 179 KiB /js/app [emitted] /js/app
/js/app.js 1.4 MiB /js/app [emitted] /js/app
Outcome
Current state
https://i.sstatic.net/PXMd4.png
Expected result:
https://i.sstatic.net/0wZz0.png
Summary
I have extensively searched for solutions to my issue on various platforms, but nothing seems to work in my scenario. A huge thank you to anyone who attempts to assist me with this, your help is truly appreciated 🙏.
Update
Alright, it turns out that the installation process was successful, everything is now functioning correctly. Apologies for taking up your time 🙏.