Как правильно подключить jquery в magento?

Пользователь

от bart , в категории: JavaScript , 2 года назад

Как правильно подключить jquery в magento?

Facebook Vk Ok Twitter LinkedIn Telegram Whatsapp

2 ответа

Пользователь

от ransom_homenick , 2 года назад

@bart 

Для подключения jQuery в Magento необходимо выполнить следующие шаги:

  1. Создать новый файл с названием "custom.js" в директории вашей темы (например, app/design/frontend/[your_vendor]/[your_theme]/web/js/custom.js).
  2. Открыть файл "default_head_blocks.xml" вашей темы в директории app/design/frontend/[your_vendor]/[your_theme]/Magento_Theme/layout и добавить следующий код:
1
2
3
4
<head>
    <script src="https://ajax.googleapis.com/ajax/libs/jquery/3.6.0/jquery.min.js"/>
    <script src="js/custom.js"/>
</head>


  1. Сохранить файл "default_head_blocks.xml".
  2. Сохранить файл "custom.js" в директории вашей темы.
  3. Очистить кэш Magento, чтобы увидеть изменения.


После этих шагов jQuery будет подключен в вашу тему Magento, и вы сможете использовать его в вашем файле "custom.js". Например, вы можете использовать следующий код, чтобы проверить, что jQuery успешно загружен:

1
2
3
$(document).ready(function() {
    console.log('jQuery успешно загружен!');
});


Обратите внимание, что вместо использования ссылки на Google CDN для загрузки jQuery, вы можете загрузить его локально на свой сервер и указать путь к файлу вместо ссылки на CDN.

Пользователь

от loyal , 10 месяцев назад

@bart 

Подключение jQuery с использованием RequireJS

  1. Создайте новый файл requirejs-config.js в директории вашей темы (например, app/design/frontend/[ваш_вендор]/[ваша_тема]/requirejs-config.js).
  2. Откройте файл requirejs-config.js и добавьте следующий код:
 1
 2
 3
 4
 5
 6
 7
 8
 9
10
var config = {
    paths: {
        'jquery': 'https://ajax.googleapis.com/ajax/libs/jquery/3.6.0/jquery.min'
    },
    shim: {
        'jquery': {
            'exports': '$'
        }
    }
};


  1. Сохраните файл requirejs-config.js.
  2. Очистите кэш Magento, чтобы увидеть изменения.


Теперь jQuery будет доступен для использования в вашей теме Magento с помощью RequireJS.

1
2
3
4
5
define(['jquery'], function($) {
    $(document).ready(function() {
      console.log('jQuery успешно загружен!');
    });
});


Обратите внимание, что вместо ссылки на Google CDN для загрузки jQuery, вы также можете загрузить его локально на свой сервер и указать путь к файлу вместо ссылки на CDN.