Fix command not found: vue on MacOS

Vue 3 has been out for some time now, and when i finally gathered enough courage to get my hands dirty with it, Vue and Vue Cli had other plans.
Long story short, when i tried creating a new project, vue cli was
using 3.1.1 and it asked me to update to the latest version 4.5.1. After updating https://cli.vuejs.org/guide/installation.html. Vue Cli was still using the old version.
This guide is aimed at walking through the installation of the latest version of Vue/ Vue-cli on MacOS Big Sur and configuring your environment variables in zshrc or bash.

Step 1. Install Vue cli in your terminal — npm install -g @vue/cli https://cli.vuejs.org/guide/installation.html

At this point, Vue and Vue cli should be installed on your MacOS and should be able to create new vue project with - vue creat [project-name]. But if vue create returns command not found: vue, proceed to the next step

Step 2. Add Vue to your path

Do - “npm bin -g” to find the path to your npm bin folder.

Next is - sudo nano ~/.zshrc

if you are using bash - sudo nano ~/.bash_profile

add - export PATH=$PATH:/Users/[username]/npm-global/bin

replace [username] with your name

Hit (ctrl + x), enter Y(Yes) and hit enter to save the changes in nano.

Replace /Users/[username]/npm-global/bin with the result of running “npm bin -g”

Close the terminal and try creating a new vue project with - vue create [project-name] and you should be sorted.

Credit:

https://medium.com/@francisbadasu/fix-command-not-found-vue-on-macos-8021ce16272d