How to remove modal.js and its related files
-
16-02-2021 - |
سؤال
I need to remove modal.js and it's related files all over the website. It is available in vendor directory and I need to remove it from DOM.
I found similar question, but no one answered it: How to remove modal.js from all pages in magento 2.2
I have also tried remove tag and add modal related js file names in it but it didn't work for me
المحلول
UI Modal is a global UI component and it is using on-demand (it means you cannot remove it with XML structs like <remove src="modal.js"/>
or something similar).
It's not only using on the frontend, but it is also using widely in adminhtml as well. For e.g:
src/vendor/magento/module-catalog/view/adminhtml/templates/catalog/category/tree.phtml
It is a part of Magento Minicart (Cart Sidebar)
src/vendor/magento/module-checkout/view/frontend/web/template/sidebar.html
However, if you don't want to use the authentication popup functionality (login popup in Checkout page). You can try to remove that block in XML by using this
<referenceBlock name="authentication-popup" remove="true"/>
Completely removing Magento_Ui/js/modal/modal
is impossible in Magento 2! It will break a lot of functionalities for sure. Of course, in theory, you still can disable the whole functionality of modal
UI with a JS mixin like this:
/**
* StackOverflow No Modal :(
*
* @category Mage
*
* @author Toan Nguyen <https://github.com/nntoan>
*/
define([
'jquery',
'uiRegistry',
'mage/utils/wrapper',
'mage/validation'
], function ($, registry, wrapper) {
'use strict';
return function (modal) {
modal.prototype._create = wrapper.wrap(modal.prototype._create, function (original) {
return null;
});
return modal;
};
});
If I was misunderstanding you, feel free to leave a comment :)
نصائح أخرى
To remove the static resources, linked in a page , make a change similar to the following in a theme extending
app/design/frontend/<Vendor>/<theme>/Magento_Theme/layout/default_head_blocks.xml
:
<page xmlns:xsi="http://www.w3.org/2001/XMLSchema-instance" xsi:noNamespaceSchemaLocation="urn:magento:framework:View/Layout/etc/page_configuration.xsd">
<head>
<!-- Remove local resources -->
<remove src="css/styles-m.css" />
<remove src="my-js.js"/>
<remove src="Magento_Catalog::js/compare.js" />
<!-- Remove external resources -->
<remove src="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.4/css/bootstrap-theme.min.css"/>
<remove src="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.4/js/bootstrap.min.js"/>
<remove src="http://fonts.googleapis.com/css?family=Montserrat" />
</head>
</page>
Reference: Remove static resources