how i fought vue-router with the help of 10 blog posts.

routing.md

routing.md

at this point, i've made github gist my archive of shitty solutions, haven't i?

Okay, seriously, I have no idea why or HOW it was so hard for me to get a decent routing system working in vue 2.0, but I did - and to be quite honest, I'm only dropping this here so that I can find it again in like .. a week.

Behold!

This is the shitshow of a router design I put together, using more posts than I can name, but I'll drop the most helpful.

• Vue 3.0 Simple Router
• Vue Router: A Tutorial for Vue 3
• StackOverflow: How to use Vue Router in Vue 2

Actual code:

// Here are the example routes I "routed". The components are respective, blah blah blah
export const routes = [
    { path: "/", component: App },
    { path: "/meow", component:  Meow }
]

/**
 * Get a component by path
 *
 * @param path path to get component by
 */
export function getComponent(name : string) : Component {
    // This probably sucks as practice .. however, I don't know vue practice, and I didn't want to deal with null
    let component!: Component;
    routes.map(route => {
        if (route.path.localeCompare(name) == 0) {
            component = route.component;
        }
    });
    return component;
}

// create router
const router = new VueRouter({
    routes
});

// fuckin export that bitch
export default router;

And what about the main.js (or .ts ..)

// It literally comes down to creating the new Vue, shoving the router in it, and rendering it as so.
const app = new Vue({
    router,
    render: function(createElement) {
        return createElement(getComponent(window.location.pathname));
    }
}).$mount('#app');