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>

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

1 个答案: