Vue.js：无法挂载组件：未定义模板或渲染函数答案

【问题标题】：Vue.js: Failed to mount component: template or render function not definedVue.js：无法挂载组件：未定义模板或渲染函数
【发布时间】：2018-01-15 15:57:45
【问题描述】：

我正在使用 Vue.js 2 构建我的第一个应用程序，但无法找出错误。

我正在使用完整版本 (webpack.config.js)：

 resolve: {
        alias: {
            'vue$': 'vue/dist/vue.js',
            "vueRouter$": "vue-router/dist/vue-router.js"
        },
        extensions: ['*', '.js', '.vue', '.json']
    },

我的html：

<div id="app">
    <adv-component></adv-component>
</div>

我的main.js：

const Vue = require('vue');
var vueComponent = require('./component.vue');
var app = new Vue({
    el: '#app', 
    data: {

    },
    // Local registration
    components: {
        'adv-component': vueComponent,
    }
});

component.vue:

<template id='asd'>
    <div>
        Hello Single File Component!
    </div> 
</template>

<script>
    export default {     
        data () {
            return 0;
        }
    }  
</script>

错误：

[Vue warn]: Failed to mount component: template or render function not defined.

found in

---> <AdvComponent>

我该如何解决这个错误？

【问题讨论】：

您能否从模板标签中删除 `id='asd'`？
@samayo 试过了。没用。这是我首先尝试解决问题的原因——在某处阅读这是必要的
你在用vuejs-template吗？ |另外，你试过github.com/vuejs/vue-router/issues/1882#issuecomment-344504483 吗？
@yuriy636 哇！谢谢。 default 成功了。如果您可以将其作为答案并解释default 的作用（我对webpack 和相关方面完全没有经验），我很乐意接受这个作为答案

标签： javascript webpack vuejs2

【解决方案1】：

Vue 组件通常使用export default { /* ... */} 导出，因此它有助于默认导入，如import Component from './component.vue'（ES6 语法）

使用require() (CommonJS) 时，您必须指定您需要default 导出：

var vueComponent = require('./component.vue').default;

【讨论】：

如果我使用 RequireJS 而不是 CommonJS，解决方案是什么？