Vuetify adds scrollbar when it’s not needed

Tags: , ,

I created a new project with vue-cli, then added vuetify with vue add vuetify. Opened the site and saw a blank page with a useless scrollbar

I tried mounting app without actually App component, but the problem still exists. It vanishes only when I remove import './plugins/vuetify'


import Vue from 'vue'
import './plugins/vuetify'
import App from './App.vue'

Vue.config.productionTip = false

new Vue({
  render: h => h(App),


I have the same problem using vue-cli 3.8 + buefy.

Not the best solution, but here’s the two ways I’m using :

Hide scrollbar globally

Scrollbar can be hidden by CSS style.

html {
  overflow: hidden !important;
  scrollbar-width: none;
  -ms-overflow-style: none;

html::-webkit-scrollbar {
  width: 0;
  height: 0;

Hide scrollbar in a specific views

I could hide scrollbar in a home.vue using DOM style.

  mounted: function() {
    let elHtml = document.getElementsByTagName('html')[0] = 'hidden'
  destroyed: function() {
    let elHtml = document.getElementsByTagName('html')[0] = null

Source: stackoverflow