Tailwind css with Vue js

Hi Every one,

I was trying to use tailwind CSS for one of my recent projects with Vue js and Laravel, But As I read on the docs.

These libraries and Tailwind UI itself all require Vue 3+. We do not currently offer support for Vue 2.

I used it with a Vue 3 project (the first time I used Vue 3) but I found some libraries that do not support Vue 3 yet like bootstrap-Vue.

My question is, have anyone tried working with Tailwind CSS alongside Vue 2? is this possible and does not pose any problems of support?

Thanks!

tykus

4 years ago

Best Answer

Level 104

Don't conflate TailwindCSS (utility-first CSS framework) with TailwindUI (Components library built with TailwindCSS);

You are free to take the HTML version of the components and work them into your own Vue 2 components.

I found some libraries that do not support Vue 3 yet like bootstrap-Vue

If you are using TailwindCSS, why also use Bootstrap?

1 like

marouanaf

4 years ago

Level 2

Thank you @tykus your answer was exactly what I needed to understand! for Bootstrap-Vue (not only bootstrap) it's a library that provides some components that I used to use especially the table component, it makes things easy for me (filtering, ordering .. data in the table) do you suggest any alternatives that provide the same thing with but not based on bootstrap? https://bootstrap-vue.org/docs/components

tykus

4 years ago

Level 104

Personally, I would look for the Vue equivalent of whatever component, e.g. vue-tables-2 for datatables.

However if the Bootstrap-Vue package allows for customisation of the component markup, and you like/know the JS api for the components already, then that is definitely a valid option.

Please or to participate in this conversation.