osm_my_commerce/layouts/default.vue

<template>
  <div>
    <nav
      class="navbar header has-shadow is-success"
      role="navigation"
      aria-label="main navigation"
    >
      <div class="navbar-brand">
        <a class="navbar-item" href="/">
          <img src="~assets/OSM-FR.svg" alt="logo osm" />
          Sur OSM
        </a>

        <div class="navbar-burger">
          <span />
          <span />
          <span />
        </div>
      </div>
    </nav>

    <section class="main-content columns">
      <aside class="column is-2 section">
        <!--        <p class="menu-label is-hidden-touch">General</p>-->
        <ul class="menu-list">
          <li v-for="(item, key) of items" :key="key">
            <nuxt-link
              :to="item.to"
              exact-active-class="has-background-success"
            >
              <b-icon :icon="item.icon" /> {{ item.title }}
            </nuxt-link>
          </li>
        </ul>
      </aside>

      <div class="container column is-10">
        <nuxt />
      </div>
    </section>
  </div>
</template>

<script>
import routelist from './routes'

export default {
  data() {
    return {
      items: routelist,
    }
  },
}
</script>