Vue Local Development Guide
Create projects with Vue 3 and Vite, featuring hot module replacement on localhost:5173, compatible with Vue Router and Pinia.
Vue is a progressive JavaScript framework, and using it with Vite is the officially recommended modern local development approach, suitable for SPAs, admin dashboards, and component libraries.
Quick Start
npm create vue@latest my-vue-app
cd my-vue-app
npm install
npm run devAlternatively, use the generic Vite template:
npm create vite@latest my-app -- --template vue-tsDefault localhost Access
| Purpose | Address |
|---|---|
| Development Server | http://localhost:5173 |
| Preview Build | http://localhost:4173 |
Common Commands
| Command | Description |
|---|---|
npm run dev | Start the Vite development server |
npm run build | Build to dist/ |
npm run preview | Preview the production build |
Ecosystem Extensions
- Vue Router: Client-side routing
- Pinia: State management
- Nuxt: Full-stack / SSR framework (similar to Next.js for React)
For SSR or file routing needs, consider Nuxt (the full-stack framework for Vue).
Summary
Vue + Vite local development can be accessed at http://localhost:5173, with a gentle learning curve, making it suitable for quickly building interactive interfaces.