时间戳

首页 > 解决方案 > Laravel Nova 覆盖 vue 组件导致 [Vue 警告]：编译模板时出错

javascript - Laravel Nova 覆盖 vue 组件导致 [Vue 警告]：编译模板时出错

问题描述

我想 在我的 nova 上使用这个https://github.com/shipshapecode/vue-shepherd来实现一个用户指南。

我将文件webpack.mix.js.dist 更改为 webpack.mix.js（在 nova 目录内）。

然后我做了：

npm install
npm run watch

并在 /nova/resources/js/views/index.vue 和 /nova/resources/js/components.js 中进行了一些更改

/nova/resources/js/components.js

import VueShepherd from 'vue-shepherd'

Vue.use(VueShepherd)

/nova/resources/js/views/index.vue

 mounted() {
    this.$nextTick(() => {
      const tour = this.$shepherd({
        useModalOverlay: true
      });
      console.log(tour);

      tour.addStep({
        attachTo: { element: this.$el, on: 'top' },
        text: 'Test'
      });

      tour.start();
    });
  },

然后我跑

php artisan nova:publish

但是现在我在控制台上遇到了这个错误 在此处输入图像描述

为什么会发生以及如何避免该错误？谢谢

标签： javascriptlaravelvue.jsvue-componentlaravel-nova

解决方案

您的 svg 中有标签样式，vue 不允许使用标签和 inside，所以，

  1. 从您的 svg 中删除标签
  2. 或将其用作

推荐阅读