@pinegrow/nuxtui-plugin
TypeScript icon, indicating that this package has built-in type declarations

3.0.37 • Public • Published

Pinegrow Nuxt UI Plugin

npm version npm downloads License

Nuxt UI plugin for Pinegrow ⚡️

Pinegrow Nuxt UI Plugin provides customized visual controls customized for your Nuxt UI experience.

Note:

Features

  • 🎨  Visually live-design your Vite-powered Nuxt UI apps (Vue, Nuxt, Iles, Astro, etc)
  • ⚙️  Smartly integrates into your Vite workflow in dev-mode only
  • ✨  Clean code 😃, No lock-in - You are in control of your projects and development workflow ❤️

Quick Setup

  1. Install: Add @pinegrow/nuxtui-plugin to your project
# Using npm
npm install -D @pinegrow/nuxtui-plugin

# Using pnpm
pnpm add -D @pinegrow/nuxtui-plugin
  1. Configure:
  • 👉 Nuxt UI uses heroicons by default and is configured only to use them. In order to use all iconsets in Vue Designer's icon-picker, the ui key of the Nuxt config has been updated (icons: 'all').

  • Also, note that there are some scenarios when colors might have to be added to the safelistColors array under the ui key. For more details, refer to the official documentation.

    // nuxt.config.ts
    export default defineNuxtConfig({
      modules: [
        '@pinegrow/nuxt-module',
        "@nuxt/ui",
        //...
      ],
      pinegrow: {
        liveDesigner: {
          iconPreferredCase: 'unocss', // default value (can be removed), Nuxt UI uses the unocss format for icon names
          //...
        },
      },
      ui: {
        icons: 'all',
        // safelistColors: [
        //   'primary',
        //   'secondary',
        //   'tertiary',
        //   'success',
        //   'warning',
        //   'error',
        //   'info',
        // ],
      },
    )}
  1. Now, open your project in your Pinegrow app (currently only Vue Designer). ✨

License

MIT License

Copyright (c) Pinegrow

Package Sidebar

Install

npm i @pinegrow/nuxtui-plugin

Weekly Downloads

33

Version

3.0.37

License

MIT

Unpacked Size

61.3 kB

Total Files

8

Last publish

Collaborators

  • pinegrowinfo
  • techakayy
  • ahmedkaja