Portanto, no Bootstrap v3, você adicionaria um atributo de deslocamento de dados à tag nav, com o deslocamento de pixel, neste caso 54px,

<nav data-offset="54"></nav>

No entanto, no Bootstrap v4, esse atributo de compensação de dados está ausente e não funciona. Eu dei uma olhada nos documentos da v4 e parece que não consigo encontrar nada! Eu também tentei usardata-offset eoffset atributos, mas estes também não funcionam.

Aqui está o código html da nav

<nav class="navbar navbar-light bg-faded navbar-fixed-top">
  <button type="button" data-toggle="collapse" data-target="#nav-collapse" aria-controls="#nav-collapse" aria-expanded="false" aria-label="Toggle navigation" class="navbar-toggler hidden-md-up">&#9776;</button>
  <div id="nav-collapse" class="collapse navbar-toggleable-sm">
    <ul class="nav navbar-nav pull-md-right">
      <li class="nav-item"><a href="#page-top" class="nav-link page-scroll">home</a></li>
      <li class="nav-item"><a href="#about" class="nav-link page-scroll">about</a></li>
      <li class="nav-item"><a href="#services" class="nav-link page-scroll">services</a></li>
      <li class="nav-item"><a href="#productssolutions" class="nav-link page-scroll">products + solutions</a></li>
      <li class="nav-item"><a href="#contact" class="nav-link page-scroll">contact</a></li>
    </ul>
  </div>
</nav>

Como eu adicionaria um deslocamento de dados de 54px? Existe uma alternativa que possa ser usada, digamos, uma simples tag de script que precise ser adicionada ao meu html com algumas linhas de js?