Vue warn: 구성 요소를 마운트하지 못했습니다. 템플릿 또는 렌더 함수가 정의되지 않았습니다.

Vue warn: 구성 요소를 마운트하지 못했습니다. 템플릿 또는 렌더 함수가 정의되지 않았습니다.

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"
  }
}

내부에서 vuejs 코드보다 높게 실행 중입니다.laravel를 참조할 수 있습니다.무엇이 문제인지 제안해 주세요.

다른 사람도 같은 문제를 안고 있었습니다.이 에러가 무엇을 의미하는지 설명했습니다.https://stackoverflow.com/a/46320757/3122639

당신의 경우, 당신은 오래된 라라벨을 사용하고 있는 것처럼 보입니다.elixir즉, 현재Laravel Mix어느 쪽이든 에일리어스를 하고 있는지 확인해야 합니다.runtime + compiler웹 팩 구성에 포함되어 있습니다.따라서, Elixir 문서를 통해 다음과 같은 파일을 생성해야 할 것으로 보입니다.webpack.conf.js다음 파일을 프로젝트의 루트에 저장합니다.

module.exports = {
  resolve: {
    alias: {
      'vue$': 'vue/dist/vue.common.js'
    }
  }
}

를 사용하는 것을 추천합니다.webpack 2사용하는 것이 아니라, 스스로elixir이 기능은 더 이상 사용되지 않습니다.

언급URL : https://stackoverflow.com/questions/46313861/vue-warn-failed-to-mount-component-template-or-render-function-not-defined