Error when using MdDialogAlert as Individual component

[givehug]

Steps to reproduce

<template>
  <div>
    <MdDialogAlert
      :md-active.sync="first"
      md-content="Your post has been deleted!"
      md-confirm-text="Cool!"
    />
    <MdButton class="md-accent md-raised" @click="first = true">Alert</MdButton>
  </div>
</template>

<script>
import Vue from 'vue';

import { MdButton, MdDialogAlert } from 'vue-material/dist/components';

Vue.use(MdButton);
Vue.use(MdDialogAlert);

export default {
  data: () => ({
    first: false,
    second: false
  })
};
</script>

render and click on the button

Which browser?

all

What is expected?

no error

What is actually happening?

Unknown custom element: <md-dialog-content> - did you register the component correctly? For recursive components, make sure to provide the "name" option.

Unknown custom element: <md-dialog-actions> - did you register the component correctly? For recursive components, make sure to provide the "name" option.

Thoughts

I guess I have import and register md-dialog-content and md-dialog-actions myself, but

• how to import md-dialog-content and md-dialog-actions (sorry but I feel like a blind chicken here, I tied several things like import MdDialogContent from 'vue-material/dist/components/MdDialog/MdDialogContent';, and there are no type definitions)
• if I import MdAlert and only use it, shouldn't it just work and not throw errors in runtime? (register all dependencies under the hood if needed)

[huffypiet]

Have you considered where you placed the Vue.use()

[huffypiet]

<template>
  <div>
    <MdDialogAlert
      :md-active.sync="first"
      md-content="Your post has been deleted!"
      md-confirm-text="Cool!"
    />
    <MdButton class="md-accent md-raised" @click="first = true">Alert</MdButton>
  </div>
</template>

<script>
export default {
  name: "App",
  data: () => ({
    first: false,
    second: false
  })
};
</script>

Omitting imports and rather only including Vue.use(VueMaterial) in the entry point, index.js or main.js should cater for all individual use cases without you having to individually import components you wish to use.