[Vuejs]-Error when using Vue plugin in Laravel: Unknown custom element: <simplert>

When registering a Vue component, you need to include a name, list below:

export default {
        name: 'example-name',
        data() {
            return {
            }
        },

so in your case:

const app = new Vue({
  el: '#app',
  name: 'example-name'
  data: {
    obj: {
      title: 'Alert Title',
      message: 'Alert Message',
      type: 'info',
      useConfirmBtn: true,
      customConfirmBtnText: 'OK'
    }
  },
  methods: {
    openSimplert () {
      this.$Simplert.open(this.obj)
    },
    closeSimplert () {
      this.$Simplert.close()
    }
  }
})

ALTERNATIVELY

you should create a file in your resources->js->components folder called something like ExampleComponent.vue. Within here you place all of your template code (what the ‘#app’ div should display).

with that file you should include:

<template>
    //code here...
</tempate>

<script>
    export default {
        name: 'example-component-name',
        data() {
            return {
                obj: {
                    title: 'Alert Title',
                    message: 'Alert Message',
                    type: 'info',
                    useConfirmBtn: true,
                    customConfirmBtnText: 'OK'
                }
            }
        },
        methods: {
            //methods here
        } 
    }
</script>

and then within your app.js file all you need to do is:

require('./bootstrap');

import Simplert from 'vue2-simplert-plugin'
require('vue2-simplert-plugin/dist/vue2-simplert-plugin.css')
Vue.use(Simplert)

Vue.component('example-component-name',require('./components/ExampleComponent.vue').default);

This should help in your situation – let me know 🙂

I don’t know why but i faced the same issu and once the plugin is registered in App.vue, some components works fine with:

<Simplert></Simplert> 

and some with

<simplert></simplert>

The only diff is the Uppercase / Lowercase but some components accepts the Uppercase when other not and i must use Lowercase.