Setup React With Vite Step-by-Step

Vite is a modern Build Tools designed to provide a fast and efficient development experience, especially for JavaScript-based applications such as React, Vue and others.

Vite itself focuses more on development speed with minimal configuration and faster loading times during the development process. Production build times are also usually faster due to optimizations from rollup

In this tutorial, you will learn how to install Reactjs with Vite step by step

Step 1
Open the terminal application that you have, here I use cmder, and go to the folder where you want to install the application

Step 2
To carry out the installation process you can use "yarn" or "npm",
type the following command in your terminal,

##NPM
npm create vite@latest

##YARN
yarn create vite

I use yarn.

After you execute the command above, you will be asked to enter the name of the application you want to create, as shown in the following image

Step 3
You will see a list; use the arrow keys to move up and down the list, click enter to select your preferred option.
In this step, we will choose React

Step 3
You will see five options to choose from, Navigate to and select
here I will choose Typescript SWC

And that's all; You now have your Vite project

Step 4
As instructed in the final results in step 3, you are asked to enter the application folder that you have created, after that run the command as instructed

### masuk ke folder aplikasi anda
cd react-vite

### install dependencies
yarn install

Step 5
After all the processes in step 4 are successful, to run the application you need to run the following command

### npm 
npm run dev

### yarn
yarn dev

After the application has been successfully run, you can access the application according to the link displayed in the terminal

Conclusion:
See, it's not difficult at all, and the whole process doesn't take long to complete.

Now you have successfully learned to install the ReactJS application using Vitejs

Thank you

The above is the detailed content of Setup React With Vite Step-by-Step. For more information, please follow other related articles on the PHP Chinese website!