$.widget is not a function Magento 2 fix

This issue is caused by multiple jquery instance, to fix it, just use the code below :

1. ADD : app/design/frontend/{Vendor}/{Theme}/requirejs-config.js

var config = {
     map: {
         '*': {
             'requirejs/require':  'requirejs/require'
         }
     }
 };

2. COPY lib/web/requirejs/require.js TO app/design/frontend/{Vendor}/{Theme}/web/requirejs/require.js

3. Line #1841 – 1885, change to :

if(moduleName!= 'jquery'){
	node.setAttribute('data-requirecontext', context.contextName);
	node.setAttribute('data-requiremodule', moduleName);
	//Set up load listener. Test attachEvent first because IE9 has
	//a subtle issue in its addEventListener and script onload firings
	//that do not match the behavior of all other browsers with
	//addEventListener support, which fire the onload event for a
	//script right after the script execution. See:
	//https://connect.microsoft.com/IE/feedback/details/648057/script-onload-event-is-not-fired-immediately-after-script-execution
	//UNFORTUNATELY Opera implements attachEvent but does not follow the script
	//script execution mode.

	if (node.attachEvent &&
	//Check if node.attachEvent is artificially added by custom script or
	//natively supported by browser
	//read https://github.com/jrburke/requirejs/issues/187
	//if we can NOT find [native code] then it must NOT natively supported.
	//in IE8, node.attachEvent does not have toString()
	//Note the test for "[native code" with no closing brace, see:
	//https://github.com/jrburke/requirejs/issues/273
	!(node.attachEvent.toString && node.attachEvent.toString().indexOf('[native code') < 0) && !isOpera) {
		//Probably IE. IE (at least 6-8) do not fire
		//script onload right after executing the script, so
		//we cannot tie the anonymous define call to a name.
		//However, IE reports the script as being in 'interactive'
		//readyState at the time of the define call.
		useInteractive = true;
		node.attachEvent('onreadystatechange', context.onScriptLoad);
		//It would be great to add an error handler here to catch
		//404s in IE9+. However, onreadystatechange will fire before
		//the error handler, so that does not help. If addEventListener
		//is used, then IE will fire error before load, but we cannot
		//use that pathway given the connect.microsoft.com issue
		//mentioned above about not doing the 'script execute,
		//then fire the script load event listener before execute
		//next script' that other browsers do.
		//Best hope: IE10 fixes the issues,
		//and then destroys all installs of IE 6-9.
		//node.attachEvent('onerror', context.onScriptError);
	} else {
		node.addEventListener('load', context.onScriptLoad, false);
		node.addEventListener('error', context.onScriptError, false);
	}
	node.src = url;
}

4. Clear all caches, deploy static content.

If this changes worked with you, please leave a comment 🙂

John Perri Cruz

About the Author

John Perri Cruz was born in the Philippines, at the cold month of december. (Not cold enough cause Philippines is a tropical country.)

He's currently working as a Fullstack Web developer and when not sleeping, he can be found in coffee shop most of the time.

He gained his experience and skills by making and developing websites and systems for various individuals. He is well equipped with different Web programming languages and tools.

Connect :


Buy me a cup of coffee :

Leave a Reply