# Tailwind CSS
# Intall Tailwind on an existing Vue Project
# Install Tailwind via npm
npm install tailwindcss
1
# Add a css Tailwind CSS file
Create the file
touch src/assets/tailwind.css
1
# Input - Add this content to the file :
@tailwind base;
@tailwind components;
@tailwind utilities;
1
2
3
2
3
# Input - Add the following lines to main.js
import Vue from "vue"
import App from "./App.vue"
import VueTailwind from "vue-tailwind"
Vue.use(VueTailwind)
Vue.config.productionTip = false
new Vue({
render: h => h(App)
}).$mount("#app")
1
2
3
4
5
6
7
8
9
10
2
3
4
5
6
7
8
9
10
# Create your Tailwind config file
Run the following command to create a tailwind.config.js file.
npx tailwindcss init
1