Vue | vite - vue, tailwind setting

Lumpen·2025년 4월 1일
0

Vue

목록 보기
1/3

npm create vite@latest

npm install tailwindcss @tailwindcss/vite

vite.config.ts

import { defineConfig } from "vite";
import vue from "@vitejs/plugin-vue";
import tailwindcss from "@tailwindcss/vite"; // 추가

// https://vite.dev/config/
export default defineConfig({
  plugins: [vue(), tailwindcss()],
});

styles.css

/* 최상단에 추가 */
@import "tailwindcss"; 

src/types/type.d.ts

declare module "@heroicons/vue/outline";

declare module "*.vue" {
  import type { DefineComponent } from "vue";
  const component: DefineComponent<{}, {}, any>;
  export default component;
}

tsconfig.app.json

{
  "extends": "@vue/tsconfig/tsconfig.dom.json",
  "compilerOptions": {
    "tsBuildInfoFile": "./node_modules/.tmp/tsconfig.app.tsbuildinfo",

    /* Linting */
    "strict": true,
    "noUnusedLocals": true,
    "noUnusedParameters": true,
    "noFallthroughCasesInSwitch": true,
    "noUncheckedSideEffectImports": true
  },
  "include": [
    "src/**/*.ts",
    "src/**/*.tsx",
    "src/**/*.vue",
    "types/**/*.d.ts", // 추가
    "src/shim.d.ts"
  ]
}
profile
떠돌이 생활을 하는. 실업자, 부랑 생활을 하는

0개의 댓글