Nuxt3 Template

A reusable Nuxt starter for projects that need a consistent baseline for localization, state management, UI integration, and image optimization.

Highlights

• Nuxt 3 + TypeScript project baseline
• Pinia with persisted state support
• i18n setup for multilingual projects
• Tailwind CSS and Element Plus integration
• Built-in image-compression workflow for better delivery performance
• Shared examples for composables, middleware, plugins, layouts, services, and typed models

Why this template exists

This template collects the project scaffolding I repeatedly need in real Nuxt work so new projects can start with stronger defaults and less setup drift.

Tech stack

• Nuxt 3
• TypeScript
• Pinia
• Tailwind CSS
• Element Plus
• i18n
• dayjs
• sharp / glob / fs-extra for image compression

Image compression workflow

When running the development server, the template also starts a small image-compression utility.
By default, images under public/assets/img are compressed into public/assets/compressImg, helping projects serve more efficient assets across device sizes.

Project structure

• components/ reusable UI examples
• composables/ shared logic
• middleware/ route middleware examples
• plugins/ app-level integrations
• services/ API-facing service modules
• store/ Pinia state modules
• types/ shared TypeScript models

Development

yarn install

yarn dev

yarn build