Vue.js 2 Design Patterns and Best Practices

Creating routes

We can then define two small components inside our main.js file that simply have a template that shows h1 with some text inside:

const Hello = { template: `<h1>Hello</h1>` };const World = { template: `<h1>World</h1>`};

Then, in order to display these components on screen at particular URLs (such as /hello and /world), we can define routes inside our application:

const routes = [  { path: '/hello', component: Hello },  { path: '/world', component: World }];

Now that we've defined what components we want to use as well as the routes inside of our application, we'll need to create a new instance of VueRouter and pass along the routes.

Although we've used Vue.use(VueRouter), we still need to create a new instance of VueRouter and ...