时间戳

首页 > 解决方案 > 如何修复“未捕获的 ReferenceError：Vue 未在 vuetemplatetest.2.html:19 中定义”

laravel - 如何修复“未捕获的 ReferenceError：Vue 未在 vuetemplatetest.2.html:19 中定义”

问题描述

我尝试使用 bootstrap-vue 设置 laravel。

npm list --depth 0
/home/<thatsme>/LARAPP/laravel
├── axios@0.18.0
├── bootstrap@4.3.1
├── bootstrap-vue@2.0.0-rc.16
├── cross-env@5.2.0
├── jquery@3.3.1
├── laravel-mix@4.0.15
├── lodash@4.17.11
├── popper.js@1.14.7
├── resolve-url-loader@2.3.2
├── sass@1.17.3
├── sass-loader@7.1.0
├── vue@2.6.10
├── vue-router@3.0.2
└── vue-template-compiler@2.6.10

给我看，没关系。目的是在没有在线链接的情况下工作。当我尝试使用简单的 html 进行测试时，我得到了主题主题中描述的错误：

<!DOCTYPE html>
<html lang="de">
  <head>
    <!-- Required meta tags -->
    <meta charset="utf-8" />
    <meta name="viewport" content="width=device-width, initial-scale=1, shrink-to-fit=no" />
    <meta http-equiv="content-type" content="text/html; charset=UTF-8" />

    <title>eijo</title>
  </head>
  <body>

<div id='app'>  
  <b-table striped hover :items="items" :fields="fields"> </b-table>
</div>


<script>
window.app = new Vue({
        el: '#app',
  data: {    fields: ['first_name', 'last_name', 'age'], 
             items: [
        { isActive: true, age: 40, first_name: 'Dickerson', last_name: 'Macdonald' },
        { isActive: false, age: 21, first_name: 'Walter', last_name: 'Shaw' },
        { isActive: false, age: 89, first_name: 'Geneva', last_name: 'Wilson' },
        { isActive: true, age: 38, first_name: 'Jami', last_name: 'Carney' }
      ]
  }
  }

编辑：在 mit app.js 中是：

import Vue from 'vue'
import BootstrapVue from 'bootstrap-vue'

Vue.use(BootstrapVue)

// app.js
import 'bootstrap/dist/css/bootstrap.css'
import 'bootstrap-vue/dist/bootstrap-vue.css'

标签： laravelvue.jsbootstrap-vue

解决方案

[编辑：] 保存问题：

div id="app" class="container"

我的 layout.blade.php 中缺少的

推荐阅读