V-Checkbox icon missing with vuetify & @mdi/js. Whats the best way to import it?

I want to know how to properly use vuetify components that itself use icons with @mdi/js.

My vuetify config looks like this:

vuetify: {
  iconfont: 'mdiSvg',
  defaultAssets: false,
  ...
}

Just importing the icons and overriding them in the v-checkbox works, but I don't want to do that with every v-checkbox I use:

<template>
  <v-checkbox
    v-model="checkboxModel"
    :indeterminate-icon="mdiCheckboxMarkedOutline"
    :on-icon="mdiCheckboxMarked"
    :off-icon="mdiCheckboxBlankOutline"
    :label="Checkbox"
  ></v-checkbox>
</template>

<script>
import {
  mdiCheckboxBlankOutline,
  mdiCheckboxMarked,
  mdiCheckboxMarkedOutline,
} from '@mdi/js'

export default {
  data() {
    return {
      checkboxModel: false,
      mdiCheckboxBlankOutline,
      mdiCheckboxMarked,
      mdiCheckboxMarkedOutline,
    }
  },
}
</script>

The other way would be to overide the $checkboxOff SASS variable.

In node_modules/vuetify/dist/vuetify.js I found the declatation of the variable.

  checkboxOff: 'M19,3H5C3.89,3 3,3.89 3,5V19C3,20.1 3.9,21 5,21H19C20.1,21 21,20.1 21,19V5C21,3.89 20.1,3 19,3M19,5V19H5V5H19Z',

This is the actual svg path of the icon (just paste it in there https://yqnn.github.io/svg-path-editor/ to see it). So I tried to override it in 'variable.scss' but with no success.

What am I missing?

Actually the problam was my wrong config. Thats how it has to be

 vuetify: {
    icons: {
      iconfont: 'mdiSvg',
     }
  ...
}