I tried to add Tailwind Elements to my Angular project to be able to use some of their components (eg: Date picker).
Unfortunately, it doesn't seem to work. I have some elements working (like the date picker field is transformed to a kinda material looking floating input). But when I click on it, my date picker calendar isn't fired.
I followed the steps given in the NPM installation guide :
1- I have Node installed and TailwindCss in my project
2- Installed Tailwind Elements via npm
3- Added the needed code in my tailwind.config.ts file :
4- I'm kinda stuck on point 4 though... They ask to add in the index.html file this script call :
<script src="./TW-ELEMENTS-PATH/dist/js/index.min.js"></script>
But I can't really do that in an Angular project (I tried but it doesn't work).
I tried as well to add this index.min.js file in my project and declare it in my angular.json file on the "scripts" section (doesn't work either).
I tried as well to call this script via a CDN (doesn't work).
So if someone has an idea to make Tailwind Elements work in an Angular project, I'll take any hint ;)
Edit
Well, in fact I managed to make Tailwind Elements work in my Angular project by adding this in my angular.json file :
"styles": [
"src/styles.scss",
"node_modules/tw-elements/dist/src/scss/index.scss"
],
"scripts": [
"src/assets/tailwind-elements.js",
"node_modules/tw-elements/dist/js/index.min.js"
]
Last problem though
In fact the problem didn't really come from my install. I tried other components and it seems to work fine. This freaking DatePicker refuses to get triggered though... So if an idea comes to your mind...