[Frage] Jquery Plugin im Backend korrekt einbinden

Hallo,

ich habe schon meherer Frontend-Plugins geschriben, nun ist es aber an der Zeit die sache auch im Backend zu verwalten.

Dabei bin ich aber auf ein Problem gestoßen

Jquery Plugins werden anscheinend nicht geladen.

Ich habe es schon wie folgt versucht:

TYPO3.jQuery(document).ready(function () {

	TYPO3.jQuery(document.body).on('click', '.toogle', function(e){
		e.preventDefault();
		TYPO3.jQuery(this).siblings().toggleClass('active');
	});
	
	

	// ist "not a function"
        TYPO3.jQuery('.input-group-type-color').colorpicker();

        // diese varianten gehen auch nicht
        jQuery('.input-group-type-color').colorpicker();
        $('.input-group-type-color').colorpicker();
	
	
});

Dabei includiere ich das Script aber wie folgt:

<f:be.pageRenderer
	loadJQuery="true"
	jQueryNamespace="none"
		includeCssFiles="{
			0:'{f:uri.resource(path:\'Lib/bootstrap-colorpicker/css/bootstrap-colorpicker.min.css\')}'
			1:'{f:uri.resource(path:\'Css/Backend/BackendLayout/input.css\')}'
		}"
	includeRequireJsModules="{
			1:'{f:uri.resource(path: \'Js/Backend/BackendLayout/input.js\')}',
			0:'{f:uri.resource(path: \'Lib/bootstrap-colorpicker/js/bootstrap-colorpicker.min.js\')}'			
		}"
/>

weiss jemand was es noch zu beachten gibt wenn man Jquery Plugins von Dritten benutzt?

Hallo,

ich konnte das Problem lösen, indem ich mein JS wie folgt nun wrappe:

require(["jquery"], function($) {
	
	$(document).ready(function () {

		$(document.body).on('click', '.toogle', function(e){
			e.preventDefault();
			$(this).toggleClass('active');
			$(this).siblings().toggleClass('active');
		});
		
		
		$('.input-group-type-color').colorpicker();	
		
		
	});
});

anscheinend reicht da ein require(["jquery"], function($) {.....});