Vue + Naive UI + Tailwindcss

我們就 follow vue 官網介紹的方式安裝

npm create vue@latest

填入你自己 project 名稱

選擇 project 中要用的功能或 feature， 我就直接全選啦。

等 npm install 完後，直接 npm run dev 看看畫面。

安裝 Naive UI

npm install naive-ui

引入 naive-ui

// main.js
import { createApp } from 'vue'
import App from './App.vue'
import naive from 'naive-ui'

const app = createApp(App)
app.use(naive)
app.mount('#app')

安裝 tailwindcss

npm install tailwindcss @tailwindcss/vite

註冊使用 tailwindcss

css 中引入 tailwindcss

最終結果。

以上我們就把 vue + naive ui + tailwind css 全部放入在一個 project 中， 供後續開發使用!