How to Setup the VueJS project?

Hi Friends 👋,

Welcome To SortoutCode! ❤️

Today, I am going to show you how do you install VueJS globally with a project example.

Vue is a javascript framework that is built for user interfaces. It is a component-based programming model that helps you efficiently develop user interfaces, be it simple or complex.

Before the vueJS framework installation, there are some pre-requirement

That is Node.js

Table of contents

• Install the node
• Install Vue globally
• Create a Vue project
• Run the Vue project

This article will guide you to How do I install the Vue framework with an example.

Step 1: Install the node

For installing the node.js, go to node.js official website and download the current version of nodejs.

Node.js is, allows developers to write JavaScript code that runs directly in a computer process itself instead of in a browser.

You can download the nodejs application from the official website Node. js

After the download is complete, install the node application in your system.

Step 2: Install Vue.js globally

Using this command you can install the Vue.js framework globally in your system

npm install -g @vue/cli

You can install vue using ‘npm’.

In this article, I am installing the project using the npm install -g @vue/cli.

You can verify that it is properly installed by simply running vue, which should present you with a help message listing all available commands.

For example, you can run this vue --version command to know your vue/cli version.

Step 3. Create Vue js project

To create a new project run this command:

vue create sortoutcode

sortoutcode is our project name.

It will give you the option to select, which version do you want to install Vue 2 or Vue 3 or perhaps choose the Manually select feature option, in this article I’m using Vue 3

Step 3: Run the Vue project

Open the Command prompt Go to your project directory and run this command npm run serve.

After running this command npm run serve server is started. Now go to Browser, and run the localhost http://localhost:8080/ to open your project is running.

All the best 👍.