A series of articles for front-end newbies Vue3+Vite+Ts+Pinia+Sass project guide - Chapter 3 Project Creation (Vite Project Initialization)

Table of contents of series of articles (click to view)



Preface

At the beginning of this article, we will start to create our own project, configure and develop it.


1. Vite creation project

1. Create

Enter this computer on a Windows computer, select the folder where you want to create the project, right-click to open the terminal with git bash or open cmd, or use the terminal on Mac to enter the folder where the project is created.

使用 NPM:
$ npm create vite@latest

使用 Yarn:
$ yarn create vite

使用 PNPM:
$ pnpm create vite

Insert image description here

2. Specific steps

1. Enter the project name
Insert image description here

2. Select vue
Insert image description here

3. Select TypeScript
Insert image description here

4. Created successfully
Insert image description here
5. You can also use shortcut commands to create it directly
Insert image description here

6. Enter the project folder
Insert image description here

7、npm install / yarn
Insert image description here

8、npm run dev / yarn dev
Insert image description here
Insert image description here

2. GitHub upload

1. Create an account

Official website:https://github.com/
Insert image description here
Register your own github account through Sign Up

2. Create a warehouse

Insert image description here
Insert image description here
Insert image description here

Insert image description here
Insert image description here

3. First submission

Follow the documentation commands to associate the local project with the remote repository and submit the code

git init
git add .
git commit -m "init"
git remote add origin https://github.com/SmallTeddy/testing-web.git
git push -u origin main

Insert image description here
After submission, refresh the warehouse interface to confirm that the code submission is successful.

Insert image description here


Summarize

This article introduces how to use Vite tools to create your own vue project

Guess you like

Origin blog.csdn.net/SmallTeddy/article/details/134461043