关于vue extend

Question

// toast.vue
<template>
  <div class="fire-toast" v-show="visible">
    <p class="fire-toast-text">{{message}}</p>
  </div>
</template>

// index.js 
import Vue from 'vue'
const ToastContructor = Vue.extend(require('./src/Toast.vue'))

const Toast = content => {
  // 生成一个实例
  const ToastInstance = new ToastContructor({
    data: {
      content: content
    }
  })
  // 组件挂载到dom元素上
  ToastInstance.vm = ToastInstance.$mount()
  ToastInstance.vm.visible = true
  document.body.appendChild(ToastInstance.vm.$el)
  return ToastInstance.vm
}

export default Toast

// main.js
import Toast from '../packages/toast'
Vue.prototype.$toast = Toast

在使用过成中直接调用this.$toast('测试')， 结果vue报错如下图， 请问哪里写错了？

Answer 1

找到原因了， https://segmentfault.com/q/10...

Answer 2

挂载到哪？$mount("#app")？