Как исправить «Uncaught ReferenceError: Vue не определен в vuetemplatetest.2.html: 19» - PullRequest
1 голос
/ 29 марта 2019

Я пытаюсь настроить laravel с помощью bootstrap-vue.

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' }
      ]
  }
  }

Редактировать: в файле 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'

Ответы [ 2 ]

0 голосов
/ 30 марта 2019

[Edit:] Спасли проблему:

div id = "app" class = "container"

, которого не было в моем layout.blade.php

0 голосов
/ 29 марта 2019

Добавьте <script src="https://cdn.jsdelivr.net/npm/vue"></script> вверху к вашему сценарию.

...