1

I've been trying to find questions, articles, or documentation covering this, but haven't been able to find what I need or haven't understood it yet.

I have a custom module that a colleague wrote (who has since left) that adds some functionality via an API endpoint that we consume in a different application.

I now need to add some javascript to the /customer/account/ page.

I've read this answer and understand that I need to put something like the below into a config file:

<?xml version="1.0"?>

<layout version="0.1.0">
    <customer_account_view>
         <reference name="head">
                <action method="addJs"><script>{my script}.js</script></action>
            </reference>
    </customer_account_view>
</layout>

Where does {my script}.js need to live inside my module directory, and which config file do I need to put the above block (if it is correct) inside my etc directory?

The current module directory looks like this:

Add to cart directory

UPDATE

The namespace for my module is James and the module is called AddToCart (i.e app/code/James/AddToCart. Following the advice inside solution 2 by @xanka, I first created the customer_account_index.xml file at the following location app/code/James/AddToCart/view/frontend/layout/customer_account_index.xml with the following contents:

<?xml version="1.0"?>
<page xmlns:xsi="http://www.w3.org/2001/XMLSchema-instance" xsi:noNamespaceSchemaLocation="urn:magento:framework:View/Layout/etc/page_configuration.xsd">
    <head>
        <script src="james_addtocart::postMessage.js"/>
    </head>
</page>

I then created the script inside the app/code/James/AddToCart/view/frontend/web/js/postMessage.js file:

console.log('test');

I then ran the following commands, unsure if necessary:

php bin/magento maintenance:enable
php bin/magento setup:upgrade
php -d memory_limit=2G bin/magento setup:di:compile
php -d memory_limit=8G -d max_execution_time=18000 bin/magento setup:static-content:deploy -f
php bin/magento maintenance:disable
php bin/magento cache:clean
php bin/magento cache:flush
redis-cli -p 6379 flushall

Everything ran successfully, however I cannot see 'test' in my dev console when I log in and visit /customer/account and when I view source, I cannot see that my script is included in the head. Where have I gone wrong?

1

1 Answer 1

2

Hope you doing well! To way right there. 1: in your theme create new layout file in <?xml version="1.0"?> <page xmlns:xsi="http://www.w3.org/2001/XMLSchema-instance" xsi:noNamespaceSchemaLocation="urn:magento:framework:View/Layout/etc/page_configuration.xsd"> <head> <script src="Magento_Customer::your_custom.js"/> </head> </page>

app/code/design/frontend/{theme_theme}/Customer/layout/customer_account_index.xml.

push your js file in your current theme like:

app/code/design/frontend/{theme_theme}/Customer/web/js/your_custom.js

2: You can create new module and push you code like

app/code/namespace/module_name/view/frontend/layout/customer_account_index.xml.

<?xml version="1.0"?> <page xmlns:xsi="http://www.w3.org/2001/XMLSchema-instance" xsi:noNamespaceSchemaLocation="urn:magento:framework:View/Layout/etc/page_configuration.xsd"> <head> <script src="namespace_modulename::your_custom.js"/> </head> </page>

Then create new {your_custom.is} in

app/code/namespace/module_name/view/frontend/web/js/{your_custom.js}

5
  • My current extension is not a theme. Can I do it from the existing extension inside app/code or do I have to create a theme to do this?
    – James
    Feb 25, 2020 at 7:45
  • Sorry I see you mention how to do it from my existing extension on option 2. I will try that!
    – James
    Feb 25, 2020 at 7:46
  • I tried option 2, and whilst I get no errors, I don't see my script running. See my updated question for steps followed. I'd really appreciate it if you could see where I have gone wrong.
    – James
    Feb 25, 2020 at 10:34
  • I have posted a new question to address the problems I am having with this not working; magento.stackexchange.com/questions/305336/…
    – James
    Feb 25, 2020 at 21:03
  • Hi @James, I answer the question pls check
    – xanka
    Feb 26, 2020 at 2:07

Your Answer

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

Not the answer you're looking for? Browse other questions tagged or ask your own question.