1

I want to remove jquery ui from magento 2.3 custom theme i used the following

<page xmlns:xsi="http://www.w3.org/2001/XMLSchema-instance" xsi:noNamespaceSchemaLocation="urn:magento:framework:View/Layout/etc/page_configuration.xsd">
    <head>
        <!-- Remove blank/luma theme styling if you declared a parent-->
        <remove src="css/styles-m.css" />
        <remove src="css/styles-l.css" />
        <remove src="css/print.css" />
        <remove src="lib/web/jquery/jquery.js"/>
        <remove src="js/jquery-ui.js"/>

But it's not working. any help would be appreciated

2
  • Have you tried by setting the src = "Magento_Theme::js/jquery-ui.js"? Jun 13 '20 at 18:34
  • @Bhaumik1987 unfotunately it's not working. I am already in Magento_Theme so it does not make any sence. but thanks alot Jun 14 '20 at 13:44
1

You can remove the core jquery-ui.js file using this:

<remove src="Lib::jquery/jquery-ui.js" />

Unfortunately, it's not a simple a that. Because Magento is using jQuery UI modules throughout its code, it then falls back to importing individually each jquery-ui module using requireJS, like below:

define([
    'jquery-ui-modules/core',
    'jquery-ui-modules/accordion',
    'jquery-ui-modules/autocomplete',
    'jquery-ui-modules/button',
    'jquery-ui-modules/datepicker',
    'jquery-ui-modules/dialog',
    'jquery-ui-modules/draggable',
    'jquery-ui-modules/droppable',
    'jquery-ui-modules/effect-blind',
    'jquery-ui-modules/effect-bounce',
    'jquery-ui-modules/effect-clip',
    'jquery-ui-modules/effect-drop',
    'jquery-ui-modules/effect-explode',
    'jquery-ui-modules/effect-fade',
    'jquery-ui-modules/effect-fold',
    'jquery-ui-modules/effect-highlight',
    'jquery-ui-modules/effect-scale',
    'jquery-ui-modules/effect-pulsate',
    'jquery-ui-modules/effect-shake',
    'jquery-ui-modules/effect-slide',
    'jquery-ui-modules/effect-transfer',
    'jquery-ui-modules/effect',
    'jquery-ui-modules/menu',
    'jquery-ui-modules/mouse',
    'jquery-ui-modules/position',
    'jquery-ui-modules/progressbar',
    'jquery-ui-modules/resizable',
    'jquery-ui-modules/selectable',
    'jquery-ui-modules/slider',
    'jquery-ui-modules/sortable',
    'jquery-ui-modules/spinner',
    'jquery-ui-modules/tabs',
    'jquery-ui-modules/timepicker',
    'jquery-ui-modules/tooltip',
    'jquery-ui-modules/widget'
],

If you want to remove all jQuery/jQuery UI code I'd suggest you might be better off not setting any of the Magento themes as the parent/fallback and literally starting from scratch with your custom theme. I have done this with previous projects. The result is really clean code only you write, but the amount of work building all the default front-end functionality is huge.

2
  • Thank you. yeah your are right. Jun 14 '20 at 13:44
  • @Readio Hi is there any way to find out which jquery-ui module code needs without going through the whole code with automation? Sep 30 at 7:12
1

thats such idiotic thing to force people to use completely useless javascripts that only slow down your site... if anyone wants to use DATEPICKER for example let them install it themselfs, instead brilliant brains of magento decided everyone wants to use such a useless thing for ecommerce site as datepicker that weights 40kb lol

1

You can directly remove the widgets which you dont use in your project in this file<magento_root>/lib/web/jquery/compact.js Although you need to keep track of this file, while deploying to production. I wish there was better way to remove so many ununsed widgets and had better way to add new/updated widgets.

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service, privacy policy and cookie policy

Not the answer you're looking for? Browse other questions tagged or ask your own question.