Stuck on an issue?

Lightrun Answers was designed to reduce the constant googling that comes with debugging 3rd party libraries. It collects links to all the places you might be looking at while hunting down a tough bug.

And, if you’re still stuck at the end, we’re happy to hop on a call to see how we can help out.

Error: Unknown custom element: <router-link>

See original GitHub issue

I have an error when trying to build a sidebar navigation with sub-navs:

[Vue warn]: Unknown custom element: <router-link> - did you register the component correctly? For recursive components, make sure to provide the “name” option. (found in component <sidebar-item>)

Here is my template:

<v-sidebar id="sidebar" fixed>
    <v-sidebar-items v-bind:items="sidebar_items"></v-sidebar>
</v-sidebar>

and my sidebar_items object:

sidebar_items: [
    { text: 'Dashboard', href: '#!', icon: 'dashboard' }
    {
        parent: { text: 'Users', href: '#!', icon: 'group' },
        items: [
              { text: 'All users', href: '#!' },
              { text: 'Deleted users', href: '#!' }
        ]
    }
]

This is the HTML:

<ul class="sidebar__items">
    <li>
        <router-link active-class="sidebar__item--active" to="#!" class="sidebar__item">
                <i class="material-icons icon">
                    <span>dashboard</span>
                </i>
                <span>Dashboard</span>
        </router-link>
    </li>
    <li class="sidebar__group">
        <a href="#!" class="sidebar__item-header">
            <i class="material-icons icon">
                <span>group</span>
            </i>
            <span>Users</span>
        </a>
        <ul class="sidebar__items" style="display: none; height: 0px;">
            <li>
                <router-link active-class="sidebar__item--active" to="#!" class="sidebar__item">
                    <!---->
                    <span>All users</span>
                </router-link>
            </li>
            <li>
                <router-link active-class="sidebar__item--active" to="#!" class="sidebar__item">
                    <!---->
                    <span>Deleted users</span>
                </router-link>
            </li>
        </ul>
    </li>
</ul>

What am I doing wrong here??

Issue Analytics

State:
Created 7 years ago
Reactions:1
Comments:11 (5 by maintainers)

Top GitHub Comments

2reactions

gabyrusucommented, Dec 20, 2016

I’m so stupid… I looked over that code 3 times before opening this issue and didn’t see that vue router is missing.

Thanks a lot for your help!

0reactions

lock[bot]commented, Apr 17, 2019

This thread has been automatically locked since there has not been any recent activity after it was closed. Please open a new issue for related bugs. Please direct any non-bug questions to our Discord