My component in Vuejs isn't rendering in my Blade View - laravel

Question

My Vuejs component isn't being rendered in my blade view. What am I doing wrong?
My component is called "star-rating".
Blade view
<div class="container">
<div class="row">
<div class="col-md-4">
**<star-rating></star-rating>**
</div>
<div class="col-md-4">
Rating - statistics
</div>
<div class="col-md-4">
#if(auth()->check())
<form method="post" action="{{ route('review.store') }}">
{{ csrf_field() }}
<h5>Form title</h5>
<div class="form-group">
<label for="headline"><strong>Headline</strong></label>
<input type="text" class="form-control" name="headline" id="headline" placeholder="Review title">
</div>
<div class="form-group">
<label for="headline"><strong>Rating</strong></label>
<input type="text" class="form-control" name="rating" id="rating" placeholder="A number from 1 - 5">
</div>
<div class="form-group">
<label for="headline"><strong>Description</strong></label>
<input type="text" class="form-control" name="description" id="description" placeholder="Tell us about your experience">
</div>
<input type="hidden" name="product_id" value="{{ $product->id }}">
<button class="btn btn-primary" type="submit">Save</button>
</form>
#else
Write a review
#endif
</div>
</div>
</div>
<div class="container">
<div class="row">
<div class="col-md-6">
<ul>
#forelse($product->reviews as $review)
<li>{{ $review->headline }}</li>
#empty
<h6>There are not reviews for this product</h6>
#endforelse
</ul>
</div>
</div>
</div>
#section('scripts')
<script src="{{asset('js/app.js')}}"></script>
#endsection
In the Vuejs, I have imported package for creating a rating system. If you would like to see the docs, are these Star Rating System Vuejs
Vuejs File
import VueStarRating from 'vue-star-rating'
require('./bootstrap');
window.Vue = require('vue');
Vue.component('example-component',
require('./components/ExampleComponent.vue'));
Vue.component('star-rating', VueStarRating);
const app = new Vue({
el: '#app'
});
I'm getting this two errors:
1) [Vue warn]: Unknown custom element: - did you register the component correctly? For recursive components, make sure to provide the "name" option.
2) CSRF token not found: https://laravel.com/docs/csrf#csrf-x-csrf-token

Answer 1

1) Make sure you are compiling the script that you wrote in app.js with
npm run watch
command.
2) I dont see any div element which has #app id. You are saying that I will target #app element with
const app = new Vue({ <br>
el: '#app'
});
But you dont have any. Try to put it:
<div class="container" id="app">

Answer 2

The solution to my problem was solved in two steps:
1) run: npm run dev
2) run: npm run watch
Now, it works