1

Using Magento 2.4. I want to add some custom JS in the admin area.

app\code\ClientQuote\AdminTheme\view\adminhtml\requirejs-config.js

var config = {
    map: {
        '*': {
            adminTheme: 'ClientQuote_AdminTheme/js/client-admin'
        }
    },

    paths: {
        'custom-script': 'ClientQuote_AdminTheme/js/client-admin'
    }
};

I can see the above in the source of /static/adminhtml/Magento/backend/en_US/requirejs-config.js

app\code\ClientQuote\AdminTheme\view\adminhtml\web\js\client-admin.js

define([
    'prototype'
], function () {
    'use strict';

    alert("andrew");
    console.log('andrew');

});

Nothing is output.

Looking at the other scripts in requirejs-config.js they all seem to added in different ways.

1 Answer 1

0

Steps to Add Custom JS File in Magento 2 Admin Panel:

  1. Create app/code/ClientQuote/AdminTheme/view/adminhtml/requirejs-config.js file with the following code:

var config = { paths: { 'custom-script': 'ClientQuote_AdminTheme/js/custom-script' }, shim: { 'js-file-alias': { deps: ['jquery'] } } };

  1. Upload the JavaScript custom-script.js file at app/code/ClientQuote/AdminTheme/view/adminhtml/web/js/

  2. Put the following code in your .phtml file to load the JavaScript file

Note : add .phtml file via layout.xml

<script> requirejs(['jquery', 'custom-script'], function($){ // Your Code }); </script>

  1. Run the following commands:

php bin/magento setup:upgrade

php bin/magento setup:static-content:deploy -f

php bin/magento cache:clean

2
  • 1
    I put my JS code in custom-script.js and a .phtml file? This is the confusion I have. Some tutorials say JS file and others .phtml Commented Sep 14, 2023 at 8:39
  • You can create .phtml file according to you. It is not fixed... Commented Sep 14, 2023 at 8:59

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service and acknowledge you have read our privacy policy.

Start asking to get answers

Find the answer to your question by asking.

Ask question

Explore related questions

See similar questions with these tags.