Symfony 5: CropperJS is not defined

[madredeuz]

I am using Symfony 5.2.6 and loaded all cropper js (not Jquery) files without webpack but I get this error in the console when I load the image.

CropperJS is not defined

I don´t want to use webpack but It looks as if the bundle is only prepared to work with webpack and required, is this true or I am doing something wrong?.

In my file:

<link href="{{ asset('js/cropperjs/cropper.css') }}" rel="stylesheet" type="text/css">
<link href="{{ asset('bundles/prestaimage/css/cropper.css') }}" rel="stylesheet" type="text/css">
<script src="{{ asset('js/cropperjs/cropper.js') }}"></script>
<script src="{{ asset('bundles/prestaimage/js/cropper.js') }}"></script>

Initialize: this part is ok, the image is loaded.

(function(w, $) {
    'use strict';

    $(function() {
        $('.cropper').each(function() {
            new Cropper($(this));
        });
    });

})(window, jQuery);

I have to comment this line in /bundles/prestaimage/js/cropper.js, otherwise I get this error in the console "The first argument is required and must be an or element.":

//const CropperJS = require('cropperjs');

Anyone know a wya to load the class without webpack?.

[J-Ben87]

Hi @madredeuz Webpack is definitely not required to use this bundle. If you have installed Cropper.js, jQuery and Bootstrap, you should be able to use it. Did you install and require Cropper.js? Also I think you should require jQuery first, then Bootstrap and Cropper.js, then the PrestaImage lib, and finally your own file:

<script src="/path/to/jquery.js"></script>
<script src="/path/to/cropper.js"></script>
<script src="/path/to/bootstrap.js"></script>
<script src="bundles/prestaimage/js/cropper.js"></script>
<script src="js/cropperjs/cropper.js"></script>

Let me know if this solves your problem :slightly_smiling_face:

[madredeuz]

Thank you for your answer. I finally make it work with webpack but I will try this method later, now I know it should work. You can close this post.

Regards