@tdesign-vue-next/nuxt

Nuxt Module for TDesign Vue Next.

✨ Release Notes

Features

📦 auto-import components from tdesign-vue-next
🗳 auto-import icons from tdesign-icons-vue-next
🎨 auto-import TDesign global CSS Variables

Quick Setup

Add @tdesign-vue-next/nuxt dependency to your project

# Using pnpm
pnpm add -D tdesign-vue-next @tdesign-vue-next/nuxt

# Using yarn
yarn add --dev tdesign-vue-next @tdesign-vue-next/nuxt

# Using npm
npm install --save-dev tdesign-vue-next @tdesign-vue-next/nuxt

Add @tdesign-vue-next/nuxt to the modules section of nuxt.config.ts

export default defineNuxtConfig({
  modules: ['@tdesign-vue-next/nuxt']
  // self-defined configuration for @tdesign-vue-next/nuxt
  // tdesign:{
  //  resolveIcons:true
  // }
});

All Configuration for @tdesign-vue-next/nuxt

name	type	default	description
resolveIcons	boolean	false	to resolve single icon components from `tdesign-icons-vue-next'
prefix	string	't'	self-defined the component prefix
iconPrefix	string	undefined	self-defined the icon prefix
iconExclude	string or RegExp (string or RegExp)	undefined	exclude icon, if match do not resolve the icon from tdesign-icons-vue-next
iconInclude	string or RegExp (string or RegExp)	undefined	included icons, only resolve icons which match iconInclude
esm	boolean	false	whether to import ESM version
plugins	TdesignPlugin	undefined	self-defined import plugin from tdesign-vue-next
exclude	string or RegExp (string or RegExp)	undefined	exclude component name, if match do not resolve the name
include	string or RegExp (string or RegExp)	undefined	included component, only resolve component which match include
importVariables	boolean or string	true	import default theme variables or not, set it to false if customize theme

That's it! You can now use Nuxt Module for TDesign in your Nuxt app ✨

Development

# Install dependencies
npm install

# Generate type stubs
npm run dev:prepare

# Develop with the playground
npm run dev

# Build the playground
npm run dev:build

# Run ESLint
npm run lint

# Run Vitest
npm run test
npm run test:watch

# Release new version
npm run release