5
votes

Comment installer Vue.js dans Laravel 8

J'utilise laravel 8 et maintenant je veux installer Vue.js J'essaye comme ça

  1. composer nécessite laravel / ui.
  2. php artisan ui vue.
  3. php artisan ui vue --auth.

0 commentaires

4 Réponses :


0
votes

Vous pouvez essayer l' npm install --save vue


1 commentaires

ok merci et je peux utiliser vue au lieu de livewire, non?



11
votes

Si vous souhaitez utiliser Vue.js dans vos projets Laravel 8, je vous suggère d'installer Jetstream avec Inertia , au lieu de Livewire . Veuillez noter que Vue.js prend le contrôle du DOM une fois installé, en détachant les nœuds et en les remplaçant, en supprimant les autres écouteurs JS. Ainsi, les éléments Alpine.js avec l'échafaudage Livewire ne fonctionneront pas. ( Il ne sera pas non plus pris en charge de si tôt. )

Vue.js , si vous souhaitez toujours utiliser Vue.js avec l'échafaudage Livewire , utilisez les instructions suivantes:

  1. exécuter npm install --save vue

  2. Ajoutez ce qui suit à vos ressources / js / app.js:

    <template>
      <div>Hello World.</div>
    </template>
    
    <script>
      export default {
        mounted() {
          console.log("Example component mounted");
        }
      };
    </script>
    
  3. Créez un ExampleComponent.vue dans le répertoire resources / js / components

     window.Vue = require('vue');
     Vue.component('example-component', require('./components/ExampleComponent.vue').default);
     const app = new Vue({
       el: '#app',
     });
    
  4. Ajoutez <script src="{{ asset('js/app.js') }}" defer></script> dans la section <head> de votre fichier de mise en page ( resources/views/layouts/app.blade.php )

  5. Ajoutez id="app" à <body> ou à <div> principal dans votre fichier de mise en page ( resources/views/layouts/app.blade.php )

  6. Ajoutez <example-component /> à votre vue

  7. Exécuter npm run dev ou npm run watch

  8. Enfin, ouvrez les outils de développement, et dans le journal de la console, vous devriez voir Example component mounted

Edit: L' interface utilisateur de Laravel sera très probablement maintenue indéfiniment, vous pouvez donc toujours l'utiliser dans vos nouvelles applications laravel au lieu de Jetstream si vous souhaitez éviter complètement l'échafaudage Inertia / Livewire.


0 commentaires

0
votes

Vous pouvez créer un projet Laravel 7 avec laravel/ui et après la mise à niveau vers laravel 8. https://laravel.com/docs/8.x/upgrade


0 commentaires

1
votes

Dans le projet laravel 8, exécutez les commandes suivantes pour installer vue.js

  1. exécuter le compositeur nécessite laravel / ui
  2. Installer Vue "php artisan ui vue"
  3. Installez Vue avec l'auth "php artisan ui vue --auth"
  4. exécuter npm install && npm exécuter dev

0 commentaires