# tdesign-nuxt

**Repository Path**: xiaolinlu/tdesign-nuxt

## Basic Information

- **Project Name**: tdesign-nuxt
- **Description**: No description available
- **Primary Language**: Unknown
- **License**: MIT
- **Default Branch**: feat/IconComponents
- **Homepage**: None
- **GVP Project**: No

## Statistics

- **Stars**: 0
- **Forks**: 0
- **Created**: 2024-08-12
- **Last Updated**: 2024-08-12

## Categories & Tags

**Categories**: Uncategorized

**Tags**: None

## README

# @tdesign-vue-next/nuxt

[![npm version][npm-version-src]][npm-version-href]
[![npm downloads][npm-downloads-src]][npm-downloads-href]
[![License][license-src]][license-href]
[![Nuxt][nuxt-src]][nuxt-href]

Nuxt Module for TDesign Vue Next.

- [✨  Release Notes](/CHANGELOG.md)
  <!-- - [🏀 Online playground](https://stackblitz.com/github/your-org/my-module?file=playground%2Fapp.vue) -->
  <!-- - [📖 &nbsp;Documentation](https://example.com) -->

## Features

<!-- Highlight some of the features your module provide here -->

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

## Quick Setup

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

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

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

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

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

```js
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             |

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

## Development

```bash
# 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
```

<!-- Badges -->

[npm-version-src]: https://img.shields.io/npm/v/@tdesign-vue-next/nuxt/latest.svg?style=flat&colorA=020420&colorB=00DC82
[npm-version-href]: https://npmjs.com/package/@tdesign-vue-next/nuxt
[npm-downloads-src]: https://img.shields.io/npm/dm/@tdesign-vue-next/nuxt.svg?style=flat&colorA=020420&colorB=00DC82
[npm-downloads-href]: https://npmjs.com/package/@tdesign-vue-next/nuxt
[license-src]: https://img.shields.io/npm/l/@tdesign-vue-next/nuxt.svg?style=flat&colorA=020420&colorB=00DC82
[license-href]: https://npmjs.com/package/@tdesign-vue-next/nuxt
[nuxt-src]: https://img.shields.io/badge/Nuxt-020420?logo=nuxt.js
[nuxt-href]: https://nuxt.com