How to Install Vue CLI on Ubuntu 20.04

In this article, we'll explain how to install Vue CLI on Ubuntu 20.04.

Vue.js is an open-source model–view–viewmodel front end JavaScript framework. This article will guide you the installation process and creating hello world first project.

Prerequisites

A Ubuntu 20.04 installed dedicated server or KVM VPS.
A root user access or normal user with administrative privileges.
Installation of NodeJS on Ubuntu 20.04

Install Vue CLI on Ubuntu 20.04

Install Vue CLI

Following command will install Vue CLI.

# npm install -g @vue/cli

Verify the installation:

# vue --version

Output:

@vue/cli 4.5.11

Create Vue project

# vue create hello-world

You will be prompted to pick a preset. You can either choose the default preset which comes with a basic Babel + ESLint setup, or select "Manually select features" to pick the features you need.

Output:

Vue CLI v4.5.11
? Please pick a preset: (Use arrow keys)
❯ Default ([Vue 2] babel, eslint)
Default (Vue 3 Preview) ([Vue 3] babel, eslint)
Manually select features

Successfully created project hello-world.
Get started with the following commands:

# cd hello-world
# npm run serve

Output:

App running at:

• Local: http://localhost:8080/
• Network: http://192.168.0.106:8080/

Note that the development build is not optimized.
To create a production build, run npm run build.

Navigate to your browser and open http://[server_IP]:8080.

That's it. The installation has been completed.

In this article, we have seen how to install Vue CLI on Ubuntu 20.04.