2017-04-26 6 views
0

Ich habe versucht, einen Server mit Passport auf Laravel 5.4 durch folgende https://laracasts.com/series/whats-new-in-laravel-5-3/episodes/13 einrichten. Ich konnte es unter der local host einrichten, aber als ich das Verzeichnis auf meinem prod server kopiert und versucht habe, darauf zuzugreifen, meine Vue-Komponenten nicht geladen. Meine DB und alle Dinge funktionierten und ich konnte die neuen Clients registrieren, aber das vue component Panel wurde nicht geladen.Vue-Komponente wird auf dem lokalen Host, aber nicht auf dem Server mit Laravel angezeigt 5.4: Passport

PS Ich denke, es auf eine Art und Weise in Beziehung gesetzt werden kann, in denen ich den Ordner Server kopiert, aber ich weiß nicht,> Ich kann andere Informationen zur Verfügung stellen, wenn

erforderlich

ich etwas bin neu in Laravel und Noob in Vue, so wird jede Hilfe sehr geschätzt.

Mein app.js

require('./bootstrap'); 

window.Vue = require('vue'); 

/** 
* Next, we will create a fresh Vue application instance and attach it to 
* the page. Then, you may begin adding components to this application 
* or customize the JavaScript scaffolding to fit your unique needs. 
*/ 

Vue.component('example', require('./components/Example.vue')); 

Vue.component(
    'passport-clients', 
    require('./components/passport/Clients.vue')); 

Vue.component(
    'passport-authorized-clients', 
    require('./components/passport/AuthorizedClients.vue')); 

Vue.component(
    'passport-personal-access-tokens', 
    require('./components/passport/PersonalAccessTokens.vue')); 

const app = new Vue({ 
    el: '#app' 
}); 

mein home.blade

@extends('layouts.app') 

@section('content') 
<div class="container"> 
    <div class="row"> 
     <div class="col-md-8 col-md-offset-2"> 
      <div class="panel panel-default"> 
       <passport-clients></passport-clients> 
       <passport-authorized-clients></passport-authorized-clients> 
       <passport-personal-access-tokens></passport-personal-access-tokens> 
     </div> 
    </div> 
</div> 
@endsection 
+0

Haben Sie Fehler auf der Konsole? Wo ist dein Element mit der ID-App? ist es auf deinem Layout? Hast du versucht, Vue-Dev-Tools für Chrome zu installieren? Sie können dann Ihre Bindungen überprüfen usw. Haben Sie SSH-Zugriff und führen Sie Ihren Mix/Webpack-Build auf dem Server oder lokal und laden Sie dann alles hoch? –

+0

@FrankProvost Hallo, basierend auf Kommentar habe ich den Build im Produktionsmodus und dann auf den Server hochladen die Vue-Komponenten funktionieren reibungslos. Aber ich stieß auf ein anderes Problem, ich bin nicht in der Lage, neue Kunden und Zugang Token zu erstellen, aber werde sie angehen. Danke Man –

Antwort

0

Das Problem konfrontiert war ich aufgrund der Tatsache, lief ich die Mischung über npm run dev d.h für Entwicklung aufzubauen. Die korrekte Vorgehensweise bestand darin, sie unter Verwendung von npm run production zu erstellen und dann auf den Server hochzuladen.

0

Kasse Ihre layout.app Klinge, in diesem Teil des Codes, werden Sie vue sagt, einen Tag mit der ID suchen = "app" initialisieren vue:

const app = new Vue({ 
    el: '#app' 
}); 

Also, wenn Sie keine haben, setzen Sie ein

<div id="app"> 

Wrapper für Ihre Seite (oder eine Spanne verwenden oder den Wähler ändern)

https://vuejs.org/v2/guide/index.html#Declarative-Rendering

+0

Es ist schon da. –

Verwandte Themen