0
0
Vueframework~5 mins

Creating a new Vue project

Choose your learning style9 modes available
Introduction

Starting a new Vue project sets up all the files and tools you need to build a web app easily.

When you want to build a new interactive website or web app using Vue.
When you need a ready setup with modern tools like hot reload and build scripts.
When you want to organize your code with Vue's recommended structure.
When you want to learn Vue by starting with a clean, working project.
When you want to add Vue to a new project without manually configuring everything.
Syntax
Vue
npm create vue@latest
# or
pnpm create vue@latest
# or
yarn create vue@latest
This command uses the official create-vue scaffolding tool to scaffold a new project.
You will be asked some questions to customize your project setup.
Examples
Runs the Vue project creation tool using npm.
Vue
npm create vue@latest
Runs the Vue project creation tool using pnpm, a fast package manager.
Vue
pnpm create vue@latest
Runs the Vue project creation tool using yarn package manager.
Vue
yarn create vue@latest
Sample Program

This example shows creating a new Vue project named my-vue-app with Vue Router and ESLint enabled. After creation, you install dependencies and start the development server.

Vue
npm create vue@latest
# Follow prompts:
# Project name: my-vue-app
# Add TypeScript? No
# Add JSX Support? No
# Add Vue Router? Yes
# Add Pinia? No
# Add Vitest? No
# Add ESLint? Yes

cd my-vue-app
npm install
npm run dev
OutputSuccess
Important Notes

You need Node.js installed on your computer before running these commands.

The prompts let you choose features like TypeScript, routing, and testing.

After setup, use npm run dev to start a local server and see your app in the browser.

Summary

Use npm create vue@latest to start a new Vue project easily.

Answer the setup questions to customize your project features.

Run npm run dev inside your project folder to see your app live.