问题
I created a simple app using some Vue components and a Bootstrap component (carousel).
I compile my assets using Laravel Mix. When I put the compiled app.js between the head tags, my Vue components 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="">
回答1:
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.
回答2:
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 recommend the asset() helper:
<script type="text/javascript" src="{{ asset('js/app.js') }}"></script>
来源：https://stackoverflow.com/questions/49791566/laravel-and-vue-where-to-put-js-app-js