Let's spin up a playground project and install the vue-router library. This allows us to take advantage of routing inside our application and give us the power of a modern SPA.
Run the following commands in your Terminal:
# Create a new Vue project
$ vue init webpack-simple vue-router-basics
# Navigate to directory
$ cd vue-router-basics
# Install dependencies
$ npm install
# Install Vue Router
$ npm install vue-router
# Run application
$ npm run dev
As we're using webpack as part of our build system, we've installed the router with npm. We can then initialize the router inside of src/main.js:
import Vue from 'vue';
import VueRouter from 'vue-router';
import App from './App.vue';
Vue.use(VueRouter);
new Vue({
el: '#app',
render: h => h(App)
});
This effectively registers VueRouter as a global plugin. A plugin simply...