Vue3 Vite Typescript Project Template

A basic starter template for a Vue3 website using Vite, TypeScript and SCSS.

Used technologies

• Vue 3 (using <script setup> SFCs)
• Vite
• TypeScript
• SCSS
• pnpm

Used packages

• Vue Router
• VueUse
• Vite Plugin Pages
• Vite SSG
• Unplugin Vue Components

This template uses static-site generation (SSG). If you want client-side rendering (CSR) instead checkout the csr branch.

Recommended IDE Setup

The recommended IDE is VSCode using the following extensions:

• EditorConfig
• Volar
• ESLint
• Prettier

Project setup

npm i -g pnpm # install pnpm
pnpm i

Compiles and hot-reloads for development

Just run and visit http://localhost:3000

pnpm dev

Build for production site

pnpm build

Update dependencies

# add --latest to update ignoring ranges specified in package.json
pnpm up