透過 100+ 個小技巧學習 Nuxt!

varlet
@varlet/nuxt

一個基於 Vue3 開發的 Material Design 行動端元件庫

Varlet Nuxt

🌟 靈感來自 vant-nuxtelement-plus-nuxt

歡迎貢獻此倉庫

適用於 Nuxt3 的 Varlet 模組

特色

  • 在您的 Nuxt 專案中自動導入 Varlet 元件
  • 自動導入 Varlet 指令
  • 元件懶加載
  • 具有 Material 3 版本的 Material Design Nuxt 元件

快速開始

  1. 新增 @varlet/nuxt 依賴到您的專案
npx nuxi@latest module add varlet
  1. 新增 @varlet/nuxtnuxt.config.tsmodules 區塊
export default defineNuxtConfig({
  modules: ['@varlet/nuxt'],
  varlet: {
    modulePath: '...',
    exclude: ['...'],
    icon: {}
  }
})

就是這樣!您現在可以在您的 Nuxt 應用程式中使用 Varlet 模組了 ✨

小提示:如果您在 PC 上運行 varlet,請安裝 @varlet/touch-emulator

選項

fieldNamerequiredefaulteffect
modulePathfalse未定義如果您需要,可自訂您的工作區路徑
排除false'.nuxt', 'node_modules'排除您不想轉換的路徑
iconfalse未定義svg 圖示轉為 iconfont

貢獻

我們推薦使用 pnpm

# Install dependencies
pnpm install

# Generate type stubs
pnpm run dev:prepare

# Develop with the playground
pnpm run dev

# Build the playground
pnpm run dev:build

# Run ESLint
pnpm run lint

# Release new version
pnpm run release