javascript – Vue警告:无法挂载组件:模板或渲染函数未定义
内容导读
互联网集市收集整理的这篇技术教程文章主要介绍了javascript – Vue警告:无法挂载组件:模板或渲染函数未定义,小编现在分享给大家,供广大互联网技能从业者学习和参考。文章包含2070字,纯文字阅读大概需要3分钟。
内容图文
![javascript – Vue警告:无法挂载组件:模板或渲染函数未定义](/upload/InfoBanner/zyjiaocheng/782/7a4a83689f5b456285e302d0a6d81ab8.jpg)
我是vuejs的新手,我收到以下错误:
错误:
[Vue warn]: Failed to mount component: template or render function not defined.
found in
---> <Anonymous>
<Vcinfo> at resources/assets/js/valuechain/Vcinfo.vue
<Root>
Vcinfo.vue
<template>
<div id="root">
<div class="navbar navbar-default">
<div class="navbar-brand">
<router-link to="/vc">VALUECHAIN</router-link>
</div>
<ul class="nav navbar-nav navbar-left">
<li><router-link to="/vc/setting_keywords">Keywords Setting</router-link></li>
<li><router-link to="/vc/keyword_search">Search Keywords</router-link></li>
</ul>
</div>
<router-view></router-view>
</div>
</template>
<style lang="css">
.navbar {
margin-top:15px;
}
</style>
vc.js
import Vue from 'vue'
import Vcinfo from './Vcinfo.vue'
import router from './router'
const app = new Vue({
el: '#vc',
components: { Vcinfo },
template: '<vcinfo></vcinfo>',
router
})
的package.json
{
"private": true,
"scripts": {
"prod": "gulp --production",
"dev": "gulp watch"
},
"devDependencies": {
"bootstrap-sass": "^3.3.7",
"gulp": "^3.9.1",
"jquery": "^3.1.0",
"laravel-elixir": "^6.0.0-14",
"laravel-elixir-vue-2": "^0.2.0",
"laravel-elixir-webpack-official": "^1.0.2",
"laravel-vue-pagination": "^1.0.6",
"lodash": "^4.16.2",
"moment": "^2.18.1",
"moment-timezone": "^0.4.1",
"vue": "^2.0.1",
"vue-js-toggle-button": "^1.1.2",
"vue-resource": "^1.0.3",
"vuejs-datepicker": "^0.9.6"
},
"dependencies": {
"axios": "^0.16.2",
"vee-validate": "^2.0.0-rc.8",
"vue-bootstrap-datetimepicker": "^3.0.0",
"vue-axios": "^2.0.2",
"vue-router": "^2.7.0",
"vue-template-compiler": "^2.4.2",
"vue2-datatable-component": "^1.1.7"
}
}
我在laravel框架内运行vuejs代码.请说明有什么问题?
解决方法:
其他人有完全相同的问题,我写了一个关于这个错误意味着什么的解释:
https://stackoverflow.com/a/46320757/3122639
在您的情况下,看起来您正在使用旧版本的laravel与elixir,现在是Laravel Mix,无论哪种方式,您都需要确保在webpack配置中对运行时编译器构建进行别名.因此,从elixir文档看起来您需要在项目的根目录中创建一个名为webpack.conf.js的文件,其中包含以下内容:
module.exports = {
resolve: {
alias: {
'vue$': 'vue/dist/vue.common.js'
}
}
}
我建议自己使用webpack 2,而不是使用已被弃用的elixir.
内容总结
以上是互联网集市为您收集整理的javascript – Vue警告:无法挂载组件:模板或渲染函数未定义全部内容,希望文章能够帮你解决javascript – Vue警告:无法挂载组件:模板或渲染函数未定义所遇到的程序开发问题。 如果觉得互联网集市技术教程内容还不错,欢迎将互联网集市网站推荐给程序员好友。
内容备注
版权声明:本文内容由互联网用户自发贡献,该文观点与技术仅代表作者本人。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如发现本站有涉嫌侵权/违法违规的内容, 请发送邮件至 gblab@vip.qq.com 举报,一经查实,本站将立刻删除。
内容手机端
扫描二维码推送至手机访问。