[Vue+Vite] Vue+Vite 테일윈드(Tailwind ) 사용하기

https://tailwindcss.com/docs/guides/vite

Install Tailwind CSS with Vite - Tailwind CSS

https://v2.tailwindcss.com/docs/guides/vue-3-vite

Install Tailwind CSS with Vite - Tailwind CSS

 

테일윈드 사용법을 보고 따라해본다.

 

 

 

 

 

 

 

code . 로 코드를 열어본다. 

 

 

 

 

 

 

위와같이 수정한다. 

/** @type {import('tailwindcss').Config} */

export default {

  content: ["./index.html", "./src/**/*.{vue,js,ts,jsx,tsx}"],

  theme: {

    extend: {},

  },

  plugins: [],

};

 

 

 

 

 

@tailwind base;

@tailwind components;

@tailwind utilities;

 

 

 

import { createApp } from "vue";

import "./style.css";

import App from "./App.vue";

createApp(App).mount("#app");

 

테스트한다.