Uncaught TypeError: $(...).raty is not a function

Question

I got this error in the view whhen I call Raty

Uncaught TypeError: $(...).raty is not a function

Chrome Console Screen

I think I fail to load the js file or there is some sort of conflict?

I put the copy/paste raty code in:

app\javascript\packs\jquery.raty.js

and I call raty in a module this:

<div id="stars"></div>

script in my view:

<script>
  $('#stars_<%= reservation.id %>').raty({
    path: '/javascript/packs',
    scoreName: 'guest_review[star]',
    score: 1
  });
</script>

my application.js

import 'bootstrap'
require("@rails/ujs").start()
require("turbolinks").start()
require("@rails/activestorage").start()
require("channels")
require("jquery")
require("jquery-ui/ui/widgets/datepicker")
import JQuery from 'jquery';
window.$ = window.JQuery = JQuery;
import toastr from 'toastr';
global.toastr = require("toastr");
toastr.options.closeButton = true;

Thank you!

---

SOLVED: require the raty.js in the application.js file

require("packs/jquery.raty")