BasicWeb Developmentbeginner

Create a Vue Project with Vite

Relax. We'll talk through this in plain words — no textbook voice.

What you'll walk away with

Create a Vue project
Run the development server
Get familiar with the main project folders

Let's break it down simply

Install Node.js, then run create-vue from your terminal. Among the project options, you can pick Vue Router, Pinia, and testing as needed. src/App.vue is the root component, and src/main.js is the entry file that starts up the app.

bash

npm create vue@latest
cd my-vue-app
npm install
npm run dev

You should see

Local: http://localhost:5173/

Try it yourself

Create a new project and change the heading in App.vue to "My Vue Lab".

Vue Quick Start — Vue.js

Easy traps

Starting the dev server before running npm install
Running the terminal outside the project directory

Exercise

Create a new project and change the heading in App.vue to "My Vue Lab".

You'll know it worked when: Local: http://localhost:5173/