Table of contents
- Step 1: Uninstall old version of vue-cli
- Step 2: Install new version of @vue/cli
- Step 3: Launch @vue/cli
- Step 4: Select features in @vue-cli
- Step 5: Open a project with code editor
- Step 6: Run the project
- Step 7: Git stage all changes
- Step 8: Git commit all changes
- Step 9: Push changes to the remote GitHub repository
- Summary
Step: 1: Uninstall old version of vue-cli
Open a terminal on your computer.
If you have new version of @vue/cli installed on your computer, then skip Step 1 and Step 2. Move to the Step 3.
If you have old version of vue-cli installed, then you need to uninstall it first by executing following command as per instructions there:
npm uninstall vue-cli -g
#or
yarn global remove vue-cli.
Step 2: Install new version of @vue/cli
If you have @vue/cli installed on your computer, then skip following line of code and move to the Step 3.
If you don't have installed @vue/cli, then execute following code in your terminal as per instructions there.
npm install -g @vue/cli
# OR
yarn global add @vue/cli
Step 3: Launch @vue-cli
In your terminal navigate to the folder you have git clone'ed from the remote GitHub repository. In my case I type:
cd Documents/code/list-with-products
Create new Vue 3 project by executing following command in your terminal:
vue create .
Step 4: Selected features in @vue-cli
You will be asked if project should be generate in the current directory? Type Y:
Navigate with arrow keys and select Default (Vue 3) by hitting enter:
Step 5: Open a project with code editor
Your new Vue 3 project is set up and ready to be maintained on your computer.
Open a project with your preferred code editor. In my case it is Visual Studio Code.
To open a project with Visual Studio code execute following commands in terminal:
code .
Step: 6: Run the project
In your code editor open a terminal and run following command:
npm run serve
Project is up and running:
Please note, that your URL address might be different. That doesn't matter. Paste this URL address to your browser and enjoy with your new Vue project.
Step: 7: Git stage all changes
Stage all changes:
Step: 8: Git commit all changes
Commit all changes:
Step: 9: Push changes to the remote GitHub repository
Push to the remote:
git push
Summary
Congrats! Your new Vue 3 project were created on your computer and pushed to the remote GitHub repository.
Top comments (1)
Hi! I have question regarding using Vue 2 and 3 on a per project basis.
I see that vue-cli is at: /usr/local/lib/node_modules/
Is it possible for me to move vue-cli into a project folder where I'm using Vue 2, and then install Vue 3 on a per project basis, without the global flag?