nav-item в Bootstrap 4.3.1 не показывает черную полосу позади элементов

Question

У меня есть этот код в App.vue:

  <li class="nav-item" v-else @click="langDropdown = false">

    <a href="#" class="nav-link inline" @click="modal = 'login'"><i style="vertical-align:sub;"><icon name="sign-in" scale="1.5"  class="icon"></icon></i>   {{$t('account.login')}}</a> 

    <a href="#" class="nav-link inline" @click="modal = 'register'"><i style="vertical-align:sub;"><icon name="user-plus" scale="1.5"  class="icon"></icon></i>   {{$t('account.register')}}</a>
  </li>
  <li class="nav-item nav-link">
    <a href="" class="nav-link link-toggle"><i style="vertical-align:sub;"><icon name="question-circle" scale="1.5"  class="icon"></icon></i>   {{$t('dashboard.common.support')}} </a>
  <a href="" >
  <div class="navbar-toggler">
      <icon name="question-circle" scale="2" class="icon"></icon>
    </div>
    </a>
  </li>
  <li class="nav-item nav-link dropdown" @click="dropdownOpen = false" :class="{'show': langDropdown}">

    <a class="nav-link dropdown-toggle user-nav" @click="langDropdown = !langDropdown" style="color: white; cursor: pointer; "><i style="vertical-align:sub;"><icon name="globe" scale="1.5" class="icon"></icon></i>   {{selectedLanguage}}</a>

    <div @click="langDropdown = !langDropdown" class="navbar-toggler">
      <icon name="globe" scale="2" class="icon"></icon>
    </div>
    <div class="dropdown-menu dropdown-menu-right" @click="langDropdown = !langDropdown">
      <a class="dropdown-item" @click="lang('en')">English</a>
      <a class="dropdown-item" @click="lang('zh')">中文</a>
    </div>
  </li>

Я использую загрузчик 4.3.1 и Vue 2.3.3.Он не показывает черную полосу за логином, регистрацией и языком.Прежде чем я обновился до Webpack 4 с Webpack 2, он сделал.Но теперь, когда я разобрался с Bootstrap-Vue и обычно использую Bootstrap, он не работает и за ними не отображается черная полоса.Что мне делать?