First, we need to create our Vue CLI project. To find how to create a Vue CLI project, please check the 'Creating your first project with Vue CLI' recipe. We can use the one we created in the last recipe or start a new one. Now, follow the instructions to add a plugin:
- Open the Vue UI interface. Open Terminal (macOS or Linux) or Command Prompt/PowerShell (Windows) and execute the following command:
> vue ui
- A new browser window will appear, with the Vue UI interface:
Here, you can list your projects, create a new project, or import an existing one.
- Now, we will import the one we created:
You need to find the folder that you created and click on Import this folder.
- After the folder is imported, the default Dashboard of the project will appear:
Here, it's possible to customize your Dashboard, adding new widgets, by clicking on the Customize button on the top:
- To add a new plugin, you must click on the Plugins menu in the left-hand sidebar:
The base plugins that you added on the Vue CLI tool will be already listed here.
- Now, we will add the base Vue ecosystem plugins—vuex and vue-router:
- If you check your code, you will see that the main.js file was changed, and the vuex (store) and vue-router (router) plugins are now imported and injected to the Vue instance: