Setup Vue project with Vite and Git.

To create a new Vue 3 application using Vite on a Windows terminal with Git integration, follow these steps:

Prerequisites

  1. Install Node.js: Ensure you have Node.js version 18 or higher installed on your system. You can download it from the official Node.js website.
  2. Install Git: Make sure Git is installed on your machine. You can download it from the official Git website.

Creating a Vue 3 App with Vite

  1. Open Terminal: Launch your terminal application on Windows. You can use Command Prompt, PowerShell, or Git Bash.
  2. Scaffold a New Vite Project:
    • Run the following command to create a new Vue 3 project using Vite:
      bash
      npm create vite@latest my-vue-app -- --template vue
    • Replace my-vue-app with your desired project name. This command will scaffold a new Vite project with Vue 3 as the template.
  3. Navigate to the Project Directory:
    • Change into the newly created project directory:
      bash
      cd my-vue-app
  4. Install Dependencies:
    • Install the necessary dependencies using npm:
      bash
      npm install

Setting Up Git

  1. Initialize Git:
    • Initialize a new Git repository in your project directory:
      bash
      git init
  2. Create a GitHub Repository:
    • If you are using GitHub CLI, log in first:
      bash
      gh auth login
    • Create a new repository on GitHub and link it to your local project:
      bash
      gh repo create
    • Follow the prompts to set up the repository, choosing to push an existing local repository to GitHub.
  3. Commit and Push Changes:
    • Stage all files and make an initial commit:
      bash
      git add .
      git commit -m "Initial commit: scaffold Vue 3 app with Vite"
    • Push the changes to the main branch on GitHub:
      bash
      git push origin main

Running the Development Server

  1. Start the Development Server:
    • Run the following command to start the Vite development server:
      bash
      npm run dev
    • Your application will be served at http://localhost:5173 by default.

These steps will set up a new Vue 3 application using Vite, with Git integration, on a Windows system. This setup allows you to start developing your application with modern tooling and version control.

Share
Rewrite