Nuxt Plugin Playbook: Ship Faster with 15 Real Patterns

Shipping a SaaS means turning shared behavior into small, predictable building blocks. A good Nuxt plugin gives you a single place to wire capabilities, test them, and expose a clean API to the rest of the app. Here is a practical playbook for what belongs in plugins, with concrete patterns you can ship this week, plus when a Nuxt SaaS starter kit is the faster move.

Authentication, email, and admin control

Centralize authentication. Wrap sign up, login, logout, token refresh, and session hydration in one plugin so pages and components call a stable API. Expose helpers like $auth.login, $auth.user, $auth.require, and $auth.hasRole. Keep tokens in httpOnly cookies, not localStorage. Use route middleware to protect pages and server route rules to block access at the edge. Support email and password, magic links, and Google with identical UI flows, and keep provider differences hidden inside the plugin.

Guard admin early. Put admin authorization in a single injection: $admin.isAllowed() and $admin.fetch for privileged API calls. Register route middleware that denies non-admins before the page renders. Prefer server-rendered admin tables with pagination to avoid leaking data into the client. Keep an explicit allowlist of admin-only components so you do not accidentally mount them for regular users.

Send transactional email from a thin client. The UI should never talk to an email provider directly. Expose $mail.sendWelcome, $mail.sendReset, and $mail.sendNotification in a plugin, then route those calls to server handlers that fill templates, set idempotency keys, and call your provider (Postmark, SES, Mailgun). Keep templates versioned with the app and add a preview route in development so writers can review copy without shipping code.

Billing, files, and data plumbing

Abstract payments behind one client. Provide $payments.checkout for one-time purchases and subscriptions, $payments.portal for self-serve changes, and $payments.status for entitlement checks. Hide provider specifics (Stripe, Paddle, Lemon Squeezy) behind the plugin. Run webhooks on the server to mark invoices paid, advance trials, and cancel on failure. Keep plan logic in one place so feature flags read $auth.plan.allows('ai.image') instead of scattering if (plan === 'pro') checks.

Inject your ORM in a server plugin. Initialize Prisma or Drizzle in a server-only plugin and inject typed repositories like db.user and db.subscription. Use a connection pool that works on your host (for example, PgBouncer on Postgres) and reuse clients across requests to avoid cold starts. Ship migrations from the same repo and run them in CI so schema and code land together.

Handle uploads with signed URLs. Expose $files.getSignedUrl and $files.upload that return secure, time-limited S3-compatible URLs. Keep buckets private and gate reads with short-lived signatures. Store only the object key in your DB. For the UI, accept a File, call $files.upload('avatars/user-123.png', file), then save the returned key. Add image resizing on write (Lambda, Cloudflare Images) so you do not serve 10 MB photos to mobile users.

Schedule recurring work safely. Register a small set of cron tasks in a server plugin. Each task should be idempotent, log its work, and accept a time window so retries are safe. Trigger them with your host’s scheduler hitting a signed internal endpoint like /internal/cron?token=.... Typical jobs: daily usage digests, payment dunning emails, deleting expired uploads, and generating weekly product analytics.

UX, content, and growth

i18n with a toggle that sticks. Initialize your translation library in a plugin, load locale messages lazily, and remember the user’s choice in a cookie so SSR renders in the right language. Provide $i18n.setLanguage(lang) and $i18n.t(key). Use route middleware to redirect first-time visitors to a detected or default locale, and keep slugs consistent across locales so links do not break.

Router-aware analytics. Start analytics in a plugin and hook router.afterEach for pageviews. Define typed events like signup_completed, checkout_started, and file_uploaded. Queue events and flush on visibility change to reduce network noise. Respect privacy: do not send PII, and give users a settings toggle to opt out. For SSR, add a server hook that logs API-level events so you are not blind to server errors and cron results.

SEO defaults once, not everywhere. Register sensible defaults for title, meta description, canonical URLs, and Open Graph. Expose a helper that merges per-page settings with defaults so each route sets only what is unique. Generate a sitemap at build time, include alternate language links, and reference it from robots.txt. Sanitize titles to a consistent pattern like "Page Title · Product Name".

Source your blog and docs from Markdown. Keep marketing and docs in the same repo without entangling them with app code. Expose a $content.find helper that returns Markdown, front-matter, and computed SEO tags. Render MD in a presentational component and map front-matter to useHead so writers control titles, descriptions, and og:image without touching Vue files.

Catch errors with one reporting hook. Install an error reporter in a plugin and capture client errors (window.onerror, unhandledrejection) and server exceptions. Attach user ID and plan after auth so you can see who hit what. Sample noisy errors and group by stack to keep alerts actionable.

AI and marketplace integrations

Wrap AI chat and generation behind one client. If you are asking how to build and sell an AI tool online, start by treating AI like any other vendor. Provide a single $ai client for chat, text, and image generation with a way to switch models by plan. Stream tokens to the UI, set timeouts and retries, and meter usage per user. Tie quotas to billing so free plans get daily caps and paid plans unlock faster models and higher limits.

Build marketplace helpers as a pluggable module. If your app targets online sellers, unify marketplace actions like syncing orders, replying to messages, and generating invoices in one plugin. Use a queue-backed sync that pages through new orders, writes them idempotently, and emits UI events when work completes. For context on day-to-day workflows, this operational guide to selling more on Mercado Libre covers software for Mercado Libre sellers to manage orders, messages, inventory, and CFDI invoicing. Let real workflows drive which endpoints you wrap first.

When a Nuxt SaaS starter kit is the faster path

There is a point where wiring plugins stops being leverage and starts delaying revenue. If you need authentication, protected pages, payments, i18n, admin, emails, files, analytics, SEO, AI calls, scheduled jobs, and a marketing site, you can either spend weeks integrating or start from a codebase that already solved it.

Our Nuxt SaaS starter kit ships those pieces in a cohesive, typed codebase: authentication (email and password, magic links, Google), an admin panel to view users and ban abusers, provider-agnostic payments for one-time and subscriptions, multi-language with a visible switch, transactional emails with ready-to-edit templates, a preconfigured database with migrations, S3-compatible uploads, router-aware analytics, SEO defaults with an automatic sitemap, AI chat plus text and image generation with switchable models, scheduled cron jobs for digests and reminders, a Markdown-powered blog/docs setup, and a landing page you can customize by swapping copy. It plays well with AI coding tools like Cursor and Claude so you can iterate quickly without fighting your stack.

Choose a starter kit when you are on a deadline, when billing accuracy matters more than custom architecture, or when your differentiation lives above the stack (workflow, UX, data). Keep plugins for app-specific logic, but do not hand-wire the fundamentals if your goal is to ship and learn from real customers.

Key takeaways

• Put cross-cutting behavior behind small, typed Nuxt plugins so pages and components stay simple.
• Hide vendors you might swap later: payments, email, storage, analytics, and AI.
• Tie AI usage to auth, plans, and quotas on day one to avoid messy retrofits.
• When speed matters, a Nuxt SaaS starter kit gets you from idea to first sale faster than wiring everything by hand.