Installing & First Nuxt App

Scaffold a Nuxt 3 app with one command, install dependencies, and start the dev server.

4 min read Level 1/5 #nuxt#install#nuxi

What you'll learn

Use nuxi init to scaffold a project
Install dependencies and run dev
Tour the generated files

Nuxt ships with nuxi, an opinionated CLI that handles scaffolding, dev, build, and module installation. Getting from zero to a running app is one command.

Scaffold

npx nuxi@latest init my-app

You will be prompted for a package manager (npm, pnpm, yarn, bun) and whether to initialize git. The result is a minimal project ready to run.

Install & Run

cd my-app
npm install
npm run dev

Open http://localhost:3000 and you will see the Nuxt welcome screen. The dev server has HMR, TypeScript checking, and the Nuxt DevTools panel attached.

What You Get

The starter is intentionally tiny:

my-app/
├─ app.vue          # entry — renders <NuxtPage />
├─ nuxt.config.ts   # config: modules, css, runtime, build
├─ package.json
├─ tsconfig.json
├─ public/          # static assets (served as-is)
└─ server/          # Nitro server routes (optional)

There is no pages/ folder yet — you add one when you want routes. Same for components/, composables/, layouts/, and so on. Nuxt enables the right features only when the corresponding folder exists.

A First Page

Create pages/index.vue and Nuxt will switch to file-based routing.

<script setup lang="ts">
const message = 'Hello from Nuxt!'
</script>

<template>
  <h1>{{ message }}</h1>
</template>

Save, and the home page updates immediately thanks to HMR.

The Nuxi CLI →