やりたいこと
Vue.jsにてSPAを実装
URLに応じてComponentを出し分ける
起こっていること
現状エラーがでており、何も表示されない
エラー内容は後述に記載
起きているエラー
app.js:33076 [Vue warn]: Failed to mount component: template or render function not defined.
[Vue warn]: Unknown custom element: <router-view>
ソース
▼ js/app.js
import VueRouter from 'vue-router'; import HeaderComponent from "./components/HeaderComponent"; import UsersListComponent from "./components/UsersListComponent"; require('./bootstrap'); window.Vue = require('vue'); Vue.use(VueRouter); Vue.component('header-component', HeaderComponent); const router = new VueRouter({ mode: 'history', routes: [ { path: '/users', name: 'users.list', component: UsersListComponent }, ] }); const app = new Vue({ el: '#app', router });
▼ app.blade.php(対象箇所)
<div id="app"> <header-component></header-component> <router-view></router-view> </div>
あなたの回答
tips
プレビュー