Vue 3 Project Setup With Vue CLI 4

In this post, we are going to setup our Vue 3 project with Vue CLI 4. Let’s get started.

Just a heads up. Vue CLI 4 requires Node.js version 8.9 or above. Make sure to install it on your system.

First step, installing Vue CLI 4

Use the command below to install Vue CLI 4 globally.

npm install -g @vue/cli

Second step, creating our first Vue project

Let’s create our first project.

vue create first-project

Third step, selecting our project configuration

• Select Manually select features preset

• Deselect Linter / Formatter option ( you can use spacebar to deselect it )

• Choose Vue 3.x as a version

• Select your config to place in In dedicated config files

• For the last step, select No and continue.

Last step, serving our project locally

After the project setup is completed, let’s preview our Vue 3 app locally.

Go to your project folder.

cd first-project

Run the development server

npm run serve

Now, our app is live on 8080 port.

http://localhost:8080/