This is a Nuxt 3 web application powered by Vuetify, Pinia, and Chart.js, designed to support a modern Vue 3 frontend architecture. It also includes API integration tools like openapi-typescript
.
- Nuxt 3 framework with full TypeScript support
- Vuetify 3 for modern, responsive UI components
- Pinia as the state management system
- Chart.js with Vue bindings for chart rendering
- OpenAPI Codegen for typed API clients
- ESLint for linting and formatting
- Icon Libraries including FontAwesome, MDI, and Iconify
Here are the main libraries required for this project:
Package | Description |
---|---|
@pinia/nuxt |
Nuxt integration for Pinia |
@fortawesome/fontawesome-free |
FontAwesome icon set |
@mdi/font |
Material Design Icons |
chart.js |
Core chart rendering library |
pinia |
State management system |
unplugin-icons |
Auto-imported icons from various sets |
vue-chartjs |
Vue 3 wrapper for Chart.js |
vuetify |
UI framework with Material Design |
vuetify-nuxt-module |
Nuxt-specific Vuetify integration |
Package | Description |
---|---|
nuxt |
Nuxt 3 framework |
typescript |
TypeScript language support |
vite |
Vite build tool (used under the hood by Nuxt) |
vue |
Vue 3 core |
vue-router |
Official router for Vue 3 |
eslint , @nuxt/eslint-config , @nuxtjs/eslint-module |
Linting setup |
@typescript-eslint/typescript-estree |
ESLint parser for TypeScript |
ajv |
JSON schema validator (optional validation tool) |
sass-embedded |
Sass compiler for Vuetify styles |
openapi-typescript |
CLI for generating typed API clients from OpenAPI |
@iconify/json |
Full icon sets for use with unplugin-icons |
Look at the Nuxt 3 documentation to learn more.
Make sure to install the dependencies:
# npm
npm install
# pnpm
pnpm install
# yarn
yarn install
# bun
bun install
Start the development server on http://localhost:3000
:
# npm
npm run dev
# pnpm
pnpm run dev
# yarn
yarn dev
# bun
bun run dev
Build the application for production:
# npm
npm run build
# pnpm
pnpm run build
# yarn
yarn build
# bun
bun run build
Locally preview production build:
# npm
npm run preview
# pnpm
pnpm run preview
# yarn
yarn preview
# bun
bun run preview
Check out the deployment documentation for more information.