How to fix Uncaught TypeError: $image.cropper is not a function

I got the error of Uncaught TypeError: $image.cropper is not a function in my project when using the cropper jQuery plugin: https://github.com/fengyuanchen/jquery-cropper

I guess the error has to do with the order defining jQuery, Bootstrap and Cropper files. After several attempts , i could not define the correct order.

My order is:

<script src="/static/theme/assets/js/jquery.min.js"></script>
<script src="/static/theme/assets/js/bootstrap.bundle.min.js"></script>
<script type="text/javascript" src="/static/cropper/js/jquery-cropper.js"></script>

If it helps , my project has to do with cropping images in a django application based on the tutorial: https://simpleisbetterthancomplex.com/tutorial/2017/03/02/how-to-crop-images-in-a-django-application.html

Here is the error:

Uncaught TypeError: $image.cropper is not a function
    at HTMLDivElement.<anonymous> ((index):425)
    at HTMLDivElement.dispatch (jquery.min.js:2)
    at HTMLDivElement.y.handle (jquery.min.js:2)
    at Object.trigger (jquery.min.js:2)
    at HTMLDivElement.<anonymous> (jquery.min.js:2)
    at Function.each (jquery.min.js:2)
    at w.fn.init.each (jquery.min.js:2)
    at w.fn.init.trigger (jquery.min.js:2)
    at HTMLDivElement.o (bootstrap.bundle.min.js:6)
    at HTMLDivElement.i (jquery.min.js:2)


 Uncaught TypeError: $image.cropper is not a function
    at HTMLButtonElement.<anonymous> ((index):451)
    at HTMLButtonElement.dispatch (jquery.min.js:2)
    at HTMLButtonElement.y.handle (jquery.min.js:2)