Vue.js 组件未知的自定义元素答案

【问题标题】：Vue.js component Unknown custom elementVue.js 组件未知的自定义元素
【发布时间】：2018-12-23 05:59:37
【问题描述】：

我在 Laravel 中使用 Vuejs，我的组件正在渲染，但 vuejs 不断给我警告未知的自定义元素。您是否正确注册了组件？

我不知道我在这里缺少什么。有时某些组件不起作用。这是isotimes.js。

App.js

require('./bootstrap');
// require('./manage');

window.Vue = require('vue');


// import 'swiper/dist/css/swiper.css'


import Buefy from 'buefy'
import VueAwesomeSwiper from 'vue-awesome-swiper'
import VueMatchHeights from 'vue-match-heights'
import { swiper, swiperSlide } from 'vue-awesome-swiper'


Vue.component('FeaturedSlider', require('./components/frontend/FeaturedSlider.vue'));
Vue.component('VehicleOffersBlock', require('./components/frontend/vehicles/VehicleOffersBlock.vue'));
Vue.component('LatestNewsBlock', require('./components/frontend/news/LatestNewsBlock.vue'));
Vue.component('FinanceCalculator', require('./components/frontend/FinanceCalculator.vue'));
Vue.component('LatestOffersBlock', require('./components/frontend/offers/LatestOffersBlock.vue'));
Vue.component('AllCompaniesBlock', require('./components/frontend/companies/AllCompaniesBlock.vue'));
Vue.component('SearchVehiclesBlock', require('./components/frontend/SearchVehiclesBlock.vue'));
Vue.component('BrandVehicles', require('./components/frontend/offers/BrandVehicles.vue'));
Vue.component('ModelTopCarusel', require('./components/frontend/vehicles/ModelTopCarusel.vue'));
Vue.component('ModelInsideImages', require('./components/frontend/vehicles/ModelInsideImages.vue'));
Vue.component('TrimSpecifications', require('./components/frontend/vehicles/TrimSpecifications.vue'));
Vue.component('AllOffers', require('./components/frontend/offers/AllOffers.vue'));
Vue.component('MainFooter', require('./components/frontend/MainFooter.vue'));



Vue.use(VueAwesomeSwiper)
Vue.use(Buefy)
Vue.use(VueMatchHeights);



export default {
    components: {
      swiper,
      swiperSlide
    }
  }

主页

<div class="container">
    <search-vehicles-block></search-vehicles-block>
</div>

<featured-slider></featured-slider>

<script>



    var app = new Vue({


      el: '#app',
        data() {
            return {
                frontCoverSwiperOptions: {
                spaceBetween: 30,
                centeredSlides: true,
                        autoplay: {
                            delay: 6000,
                            disableOnInteraction: false
                        },
                        pagination: {
                            el: '.swiper-pagination',
                            clickable: true,
                            dynamicBullets: true
                        },
                        navigation: {
                            nextEl: '.swiper-button-next',
                            prevEl: '.swiper-button-prev'
                        }
                    }
                }
            }
    });
</script>

请帮帮我。

谢谢

【问题讨论】：

能否将您的代码包含在文本中？还请包括 Root.vue
你好，@Sumurai8 我用代码更新了我的问题。我不明白 Root.vue
github.com/amirehman/autozmart你可以查看repo
我猜App.js 只是从未为该页面加载，而是您正在现场将页面转换为（无名）根组件。
确保您在首页script之前加载app.js

标签： laravel vue.js vue-component

【解决方案1】：

有时即使我遇到这个问题，我也会用- 添加组件名称。尝试这个： Vue.component('search-vehicles-block', require('./components/frontend/SearchVehiclesBlock.vue'));

请清除缓存。

【讨论】：