水墨UI

https://github.com/youuss/shuimo-ui

Admin

一款开箱即用的中国传统水墨风格UI组件库，旨在为追求艺术美感并希望快速构建的用户提供独特的设计体验。

Tokens:274

Snippets:3

Trust Score:6.1

License:MIT

Update:11 months ago

Show doc for...

Tokens:

Raw

### Install Shuimo UI Nuxt Module

Source: https://github.com/youuss/shuimo-ui/blob/main/plugins/nuxt/README.md

Command to add the Shuimo UI Nuxt module as a dependency to your Nuxt project. This command uses npx to execute the Nuxt CLI module add command.

```bash
npx nuxi@latest module add @shuimo-design/shuimo-ui-nuxt
```

--------------------------------

### Use MLoadingPreview Component in Vue

Source: https://github.com/youuss/shuimo-ui/blob/main/plugins/nuxt/README.md

Example of using the MLoadingPreview component within a Nuxt/Vue application. This component is used to display a loading animation during time-consuming operations like asset preloading.

```vue
<template>
  <div>
    <client-only>
      <MLoadingPreview v-model="isLoading" v-if="isLoading" :preInit="preInit"/>
    </client-only>
    <your-main-display-component v-if="!isLoading">

    </your-main-display-component>
  </div>
</template>


<script setup lang="ts">

  const isLoading = ref(true);

  const preInit = async () => {
    await import('ASSET_URL');
    // or other time-consuming operations
    return true;
  };
</script>
```

Tokens:

Raw