VueJs：无法挂载组件

Question

我正在使用Vue Router，而不是加载组件，它抛出了我这个模糊的错误：

Failed to mount component: template or render function not defined.

found in
---> <Anonymous>
       <Root>

这是我的入口点（app.js） （注意我正在使用多个条目与CommonsChunksPlugin结合）：

import Vue from 'vue'

import '../../../assets/css/main.css'

import App from './app.vue'

new Vue(App).$mount('#app')

Html文件（app.html）

<!DOCTYPE html>
<html>
<head>
  <meta charset="utf-8">
  <meta name="viewport" content="width=device-width, initial-scale=1.0, 
maximum-scale=1.0, user-scalable=0">

</head>
<body>
    <div id="app"></div>
</body>
</html>

（app.vue）

<template>
<div>
    <router-view></router-view>
</div>
</template>
<script>
    import {
            router,
    } from './bootstrap.js';
    export default {
        router,
    };
</script>

路由器：

import Vue from 'vue';

import VueRouter from 'vue-router';

var routes = [
                {
                    path: '/login',
                    name: 'login.index',
                    component: require('./index/index.vue'),
                },
                {
                    path: '/',
                    redirect: '/login',
                },
        ];

Vue.use(VueRouter);

export const router = new VueRouter({
     routes,
});


Vue.router = router;

export default {
    router,
};

最后组件：

<template>
<div>
    <h1>Test</h1>
</div>
</template>

<script>
    export default {}
</script>

我按预期重定向到/ login，但组件不会加载。

Answer 1

您可能正在遇到此处描述的重大变化： https ： //github.com/vuejs/vue-loader/releases/tag/v13.0.0

尝试将.default添加到require()的末尾。

component: require('./index/index.vue').default

Answer 2

您尚未在app.js文件中导入组件，应导入此组件文件。 我们说它的名字是xyz.vue

import componentName from 'path';

 <template> <div> <h1>Test</h1> </div> </template> <script> export default {} </script>

VueJs：无法挂载组件

问题描述

2 个解决方案

解决方案1
15 2017-08-31 11:52:02

解决方案2
0 2017-08-30 18:09:01

VueJs：无法挂载组件

问题描述

2 个解决方案

解决方案1 15 2017-08-31 11:52:02

解决方案2 0 2017-08-30 18:09:01

解决方案1
15 2017-08-31 11:52:02

解决方案2
0 2017-08-30 18:09:01