javascript - Laravel and Vue: where to put jsapp.js? - Stack Overflow

admin管理员组

文章数量:1332359

I created a simple app using some Vue ponents and a Bootstrap ponent (carousel).

I pile my assets using Laravel Mix. When I put the piled app.js between the head tags, my Vue ponents do not work (Cannot find element: #app). When I put the app.js just before the </body> tag, my carousel (the indicators) does not work ... I also tried with the defer attribute, but no success. Do I have to split my JavaScript-files to make both work?

Edit:

When I put my asset just before the </body> tag, the indicators of the carousel looks like this: <="" li="">

I created a simple app using some Vue ponents and a Bootstrap ponent (carousel).

I pile my assets using Laravel Mix. When I put the piled app.js between the head tags, my Vue ponents do not work (Cannot find element: #app). When I put the app.js just before the </body> tag, my carousel (the indicators) does not work ... I also tried with the defer attribute, but no success. Do I have to split my JavaScript-files to make both work?

Edit:

When I put my asset just before the </body> tag, the indicators of the carousel looks like this: <="" li="">

• javascript
• twitter-bootstrap
• vuejs2
• bootstrap-4
• laravel-5.5

Share Improve this question Follow edited Apr 12, 2018 at 9:20 user3253002 asked Apr 12, 2018 at 8:28 user3253002user3253002 1,68133 gold badges2525 silver badges4444 bronze badges 0

Add a ment  | 

2 Answers 2

Sorted by: Reset to default 4

In general, before the ending </body> tag.

<script type="text/javascript" src="/js/app.js"></script>

And if you have other bootstrap specific js codes, you have to write them after the above-mentioned script tag because app.js is also responsible for loading bootstrap required js files in the resources/assets/js/bootstrap.js file.

The message Cannot find element: #app does not mean, that vue do not work. It means, that Vue.js is mounted correctly but it can not find any div with the id of app:

<div id="app"></div>

To include an js file I would remend the asset() helper:

<script type="text/javascript" src="{{ asset('js/app.js') }}"></script>

本文标签： javascriptLaravel and Vue where to put jsappjsStack Overflow