Overview
The Nuxt 3 + PrimeVue Starter is a starter template for building Vue.js apps with Nuxt 3. It offers first-class support for PrimeVue and includes features such as SSR, ESR, file-based routing, components auto importing, modules, and more. It is based on the Nuxt-Sakai Theme and also includes other tools like UnoCSS, Pinia for state management, TipTap for the headless editor, and Vitest for unit testing. The project setup and usage is explained in detail, and IntelliJ with the VUE.js plugin is recommended for development.
Features
- Nuxt 3 - SSR, ESR, file-based routing, components auto importing, modules, etc.
- Vite - Instant HMR
- UnoCSS - The instant on-demand atomic CSS engine
- Use icons from any icon sets in Pure CSS, powered by UnoCSS
- State Management via Pinia
- PrimeVue 3.30.x with free Sakai Theme
- TipTap - Headless Editor
- Vitest - Blazing Fast Unit Test Framework
- Nuxt Modules
- Pinia - intuitive, type safe, light and flexible Store for Vue
- VueUse - collection of useful composition APIs
- FormKit - Validation
- PrimeVue - PrimeVue Components and Services, PrimeVue Form Validation by formkit-primevue
- UnoCSS - the instant on-demand atomic CSS engine
- Content - parses .md, .yml, .csv and .json files
- I18n - Integration with Vue I18n
- Histoire (Storybook like Component Viewer)
- Variations
- vite-primevue-starter
- Vite Primevue Starter Template
Installation
To install the Nuxt 3 + PrimeVue Starter, follow these steps:
- Install the latest LTS version of Node.js (version 18) using a Node manager like nvm.
- Install pnpm:
https://pnpm.io/installation
- Install the dependencies:
npm install
- Run the development server:
npm run dev
- Use the Vitest test runner:
npm run test
- Build the project:
npm run build
- Start the production build:
npm run start
Summary
The Nuxt 3 + PrimeVue Starter is a powerful starter template for building Vue.js apps with Nuxt 3. It offers a wide range of features and tools, including support for PrimeVue, UnoCSS for instant on-demand atomic CSS, Pinia for state management, and TipTap for the headless editor. The installation process is straightforward, and the template can be easily customized and extended for any Vue.js project.