VueJS组件未渲染，返回字符串

Question

我的问题是没有渲染名为“ notification”的vue组件。它实际上返回此字符串<!--function(e,n,r,i){return rn(t,e,n,r,i,!0)}-->

下面是我的app.js

import swal from 'sweetalert';
import StarRating from 'vue-star-rating';

require('./bootstrap');
window.Vue = require('vue');

Vue.component('notification', require('./components/Notification.vue'));
Vue.component('books', require('./components/Books.vue'));
Vue.component('book-row', require('./components/BookRow.vue'));
Vue.component('star-rating', StarRating);


var app = new Vue({
  el: '#app',
  methods: {
    setRating: function(rating){
        $.ajaxSetup({
            headers: { 'X-CSRF-TOKEN': $('meta[name="csrf-token"]').attr('content') }
        });
        $.ajax({
            type: 'post',
            url: '/set-book-rating',
            dataType: 'json', 
            data: {
                'book_id': window.BookID,
                'rating': rating,
            },
            success: function(data) {
            },
            error: function(response){

            },
        });
    }
  },
  computed :{
      rating : function(){
        if (typeof user_rating !== 'undefined') {
            return user_rating;
        } else {
            return null;
        }
      }
   },
});

这是我的刀片文件

<notification :user="{{auth()->user()}}" :notifications="{{auth()->user()->notifications->take(4)}}"></notification>

请多多帮助。