Використовуйте Requ-config.js для завантаження необхідних файлів на всі сторінки

Я знаю, як користуватися require-config.jsспеціальною темою, але я хотів би використовувати користувальницький файл JavaScript ( myfile.js) на всіх сторінках. У який каталог я повинен додати require-config.jsі як ним користуватися, щоб він працював як слід?

Будь ласка, не посилайтесь на офіційну сторінку Magento.

requirejs-config.jsвикористовує для створення відображення ресурсів JavaScript . Ми можемо знайти все вимагають конфіги в: pub/static/_requirejs.

Наскільки я знаю, правильний спосіб завантажити наш користувальницький сценарій через Require Js: використовуючи шаблон для виклику нашого сценарію . Ми створимо новий шаблон із Magento\Framework\View\Element\Templateйого блоковим класом.

Якщо ми хочемо завантажити js-файли на всі сторінки та не хочемо створювати новий модуль, наш блок повинен посилатися на before.body.endабоafter.body.start container в default.xmlмодуль теми Magento.

app / design / frontend / Vendor / Theme / Magento_Theme / layout / default.xml

<?xml version="1.0"?>

<page layout="3columns" xmlns:xsi="http://www.w3.org/2001/XMLSchema-instance" 
      xsi:noNamespaceSchemaLocation="urn:magento:framework:View/Layout/etc/page_configuration.xsd">

    <referenceContainer name="after.body.start">
        <block class="Magento\Framework\View\Element\Template" name="custom.js" template="Magento_Theme::custom_js.phtml"/>
    </referenceContainer>

</page>

app / design / frontend / Vendor / Theme / Requjs-config.js

var config = {
    map: {
        '*': {
            customScript:'Magento_Theme/js/customscript'
        }
    }
};

app / design / frontend / Vendor / Theme / Magento_Theme / web / js / Customscript.js

define('jquery', function($) {

    //Your code here
    //alert('Here');

    }(jQuery)
);

Наш шаблон буде називати наш сценарій: app / design / frontend / Vendor / Theme / Magento_Theme / templates / custom_js.phtml

<script>// <![CDATA[
    require([
        'jquery',
        'customScript'
    ], function ($, script) {
        //Your code here
        //alert('Here');
    });
    // ]]>
</script>

Очистіть кеш Magento та запустіть розгортання статичного вмісту: php bin/magento setup:static-content:deploy

Файл Requirejs-config: app / code / Vendor / Module / view / frontend / Requjs-config.js

var config = {
    paths: {            
         'myfile': "Vendor_Modulename/js/myfile"
      },   
    shim: {
    'myfile': {
        deps: ['jquery']
    }
  }
} 

Ваш js-файл повинен бути у: app / code / Vendor / Module / view / frontend / web / js / myfile.js

Тепер ви можете використовувати будь-де у вашому файлі шаблону методом нижче:

<srcipt>
 require(["jquery","myfile"],function($,myfile){
     $(document).ready(function(){
        //call your js here...
     })
 })
</script>

Існує простіша версія використання deps. Залежності в Requjs-config.js завантажуватимуть ваш файл під час завантаження самих Requjs (скрізь у магазині). Ось приклад того, як повинен виглядати ваш Requjs-config.js :

var config = {
    // When load 'requirejs' always load the following files also
    deps: [
        'common-js'
    ],

    // Library file path.
    paths: {
        'common-js': 'js/Your-File-Name'
    },

    // The rest of your config file ...

Як альтернативний підхід до рекомендації Khoa, який є відмінною практикою Magento Dev, ви можете вставити свій JavaScript у файл .phtml таким чином:

<srcipt>
require(["jquery"],function($){
 $(document).ready(function(){
    your script here...
 })
});
</script>

Потім зв’яжіть файл phtml з default.xml, як описано у відповіді Хої, хоча я рекомендував би додати його до before.body.end. А потім зателефонуйте своєму JS-скрипту з copyright.phtml , наприклад:

<script>
jQuery(document).ready(function($) {
..call your script here ..
});
</script>

copyright.phtml завантажується на кожну сторінку, навіть на такі сторінки, як реєстрація, де нижній колонтитул опущено.