Должен ли я загружать Vue JS вручную в laravel?

Я добавил немного кода Vue в представление проекта Laravel. Нужно ли включать vuejs в макет, например:

<script src="https://cdnjs.cloudflare.com/ajax/libs/vue/1.0.12/vue.js"></script>

Или laravel как-то позаботится об этом.

Что я пробовал:

Я запустил npm install и npm run dev, и теперь у меня есть app.js и app.css в общем каталоге.

и у меня есть следующее в представлении:

const app = new Vue({
el: '#app',

data: {
  comments: {},
  post: {!! $post->toJson() !!},
  user: {!! Auth::check() ? Auth::user()->toJson() : 'null' !!},
  comment: 'Your Comment'
},
mounted(){
  this.getComments();
},
methods:{
  getComments(){
    //Some code here
  }
}
});

Но когда я получаю доступ к этому представлению, я получаю:

ReferenceError: Vue is not defined

person Afghan Dev    schedule 16.09.2019    source источник


Ответы (2)


1- Вы должны добавить свой скрипт в свой индексный файл

2- затем добавьте эти коды vue в файл app.js в resources\js\app.js

person sajad Haibat    schedule 16.09.2019

Запустите npm prod, чтобы скомпилировать файл vue и добавить его в конец тега body, где вы хотите его использовать.

Как Vue.js используется в laravel

когда мы запустим npm install, он загрузит все пакеты в каталог node_modules, которые упомянуты в webpack.mix.js.. Затем мы добавим необходимые плагины в resources/js/app.js.

В resources/js/app.js мы инициализируем vue.js, используя

new Vue(
     el:'#id_of_the_element'
})

Затем мы запускаем npm run prod, чтобы скомпилировать уменьшенную версию vue.js и поместить ее public/js/app.js теперь ее можно добавить туда, где это необходимо.

<html>
  <body>
      <div id="id_of_the_element">
         //....
      </div>
      //import your app.js here
      <script src="/js/app.js">
   </body>
</html>
person Afraz Ahmad    schedule 26.10.2019