How to Install Vue.js on Oracle Linux 8

Vue.js is a progressive JavaScript framework that allows you to build user interfaces and single-page applications. It is a famous framework used to simplify the web development process. Vue.js provides useful functionalities for progressive enhancement, allowing you to use it as a drop-in replacement for a library like jQuery. It is simple, reactive, and easy to learn for someone with knowledge of HTML, CSS, and JavaScript.

In this post, we will show you how to install Vue.js on Oracle Linux 8.

Step 1 – Install Node.js

Before starting, you will need to install Node.js on your server. First, list all available Node.js versions using the following command:

dnf update -y
dnf module list nodejs

You will get the following output:

Last metadata expiration check: 1:15:30 ago on Tuesday 19 July 2022 03:11:19 AM EDT.
Oracle Linux 8 Application Stream (x86_64)
Name                     Stream                   Profiles                                                Summary                             
nodejs                   10 [d]                   common [d], development, minimal, s2i                   Javascript runtime                  
nodejs                   12                       common [d], development, minimal, s2i                   Javascript runtime                  
nodejs                   14                       common [d], development, minimal, s2i                   Javascript runtime                  
nodejs                   16 [e]                   common [d], development, minimal, s2i                   Javascript runtime                  

Hint: [d]efault, [e]nabled, [x]disabled, [i]nstalled

Next, enable Node.js version 16 and install it using the following command:

dnf module enable -y nodejs:16
dnf install -y nodejs npm

Once Node.js is installed, you can verify the Node.js version with the following command:

node -v

Output:

v16.14.0

You can also see the NPM version using the following command:

npm -v

Output:

8.3.1

Step 2 – Install Vue CLI

Vue CLI is a complete package used for developing and managing Vue.js applications. You can install it using NPM as shown below:

npm install -g @vue/cli

Once Vue CLI is installed, verify its version with the following command:

vue --version

You should see the Vue CLI version in the following output:

@vue/cli 5.0.8

Step 3 – Create an Application with Vue.js

To use Vue.js, let’s create a sample application with the following command:

vue create web-application

You should see the following output:

Vue CLI v5.0.8
? Please pick a preset: (Use arrow keys)
❯ Default ([Vue 3] babel, eslint) 
  Default ([Vue 2] babel, eslint) 
  Manually select features 
⚓  Running completion hooks...

📄  Generating README.md...

🎉  Successfully created project web-application.
👉  Get started with the following commands:

 $ cd web-application
 $ npm run serve

 WARN  Skipped git commit due to missing username and email in git config, or failed to sign commit.
       You will need to perform the initial commit yourself.

Next, change the directory to your application directory and run your application using the following command:

cd web-application
npm run serve

You should see the following output:

> [email protected] serve
> vue-cli-service serve

 INFO  Starting development server...

 DONE  Compiled successfully in 7390ms                                                                                              4:30:40 AM


  App running at:
  - Local:   http://localhost:8080/ 
  - Network: unavailable

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

Step 4 – Access Vue.js Application

At this point, the Vue.js application is started and listens on port 8080. You can now access it using the URL http://your-server-ip:8080. You should see the Vue.js application default page on the following screen:

Conclusion

In this post, we explained how to install Vue.js on Oracle Linux 8. We also created a sample application using Vue.js. You can now start using the Vue.js framework to develop a modern web application – give it a try on your VPS hosting account today!