无法在嵌套文件夹中异步加载 vue 组件

Question

我正在使用 webpack 1.13 和 Vue 2.1

说文件夹结构是

src__
     |
     page.vue
     views___
             |
             mainViews____
                          |
                          mainContainer.vue

我在 page.vue 的什么地方

<template>
    <component v-bind:is='"mainContainer"'></component>
</template>
.
.
.
beforeMount () {
    Vue.component('mainContainer', function (resolve) {
        require(['./views/mainViews/mainContainer'], resolve)
    })
}

组件未加载。

但是当被加载的组件是它加载的组件的兄弟时，它可以工作。

src__
     |
     page.vue
     mainContainer.vue


Vue.component('mainContainer', function (resolve) {
    require(['./mainContainer'], resolve)
})

控制台或构建中没有错误。我想我的问题是为什么它只在组件是文件夹结构中的兄弟时才起作用

Answer 1

你必须导入组件并在page.vue中注册，像这样：

<script> import MainContainer from "maincontainer's file path"

export default { ... components: { mainContainer: MainContainer } } </script>