Use require-config.js para cargar los archivos necesarios en todas las páginas

Sé cómo usar require-config.jsun tema personalizado, pero me gustaría usar un archivo javascript personalizado ( myfile.js) en todas las páginas. ¿En qué directorio debo agregar require-config.jsy cómo usarlo, para que funcione como debería?

Por favor, no haga referencia a la página oficial de Magento.

requirejs-config.jsutiliza para crear la asignación de recursos de JavaScript . Podemos encontrar todos requieren configuraciones en: pub/static/_requirejs.

Hasta donde sé, la forma correcta de cargar nuestro script personalizado a través de Require Js: usando la plantilla para llamar a nuestro script . Crearemos una nueva plantilla con Magento\Framework\View\Element\Templatesu clase de bloque.

Si queremos cargar archivos js en todas las páginas y no queremos crear un nuevo módulo, nuestro bloque debe hacer referencia al módulo Tema de Magento before.body.endoafter.body.start container en él default.xml.

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 / requirejs-config.js

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

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

define('jquery', function($) {

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

    }(jQuery)
);

Nuestra plantilla llamará a nuestro script: app / design / frontend / Vendor / Theme / Magento_Theme / templates / custom_js.phtml

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

Borre Magento Cache y ejecute la implementación de contenido estático: php bin/magento setup:static-content:deploy

Archivo requirejs-config: app / code / Vendor / Module / view / frontend / requirejs-config.js

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

Su archivo js debe estar en: app / code / Vendor / Module / view / frontend / web / js / myfile.js

Ahora puede usar cualquier parte de su archivo de plantilla con el siguiente método:

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

Hay una versión más fácil de usar deps. Las dependencias en requirejs-config.js cargarán su archivo al cargar requirejs (en todas partes de la tienda). Aquí hay un ejemplo de cómo debería verse su requirejs-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 ...

Como un enfoque alternativo a la recomendación de Khoa, que es una excelente práctica de desarrollo de Magento, puede pegar su JavaScript en un archivo .phtml como este:

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

Luego vincule su archivo phtml de default.xml como se describe en la respuesta de Khoa, aunque recomendaría agregarlo a before.body.end. Y luego llame a su script JS desde copyright.phtml , de esta manera:

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

copyright.phtml se carga en cada página, incluso en páginas como el pago, donde se omite el pie de página.