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?

asked Feb 25, 2020 at 6:42
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}

answered Feb 25, 2020 at 7:41
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? Commented 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! Commented 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. Commented 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/… Commented Feb 25, 2020 at 21:03
  • Hi @James, I answer the question pls check Commented Feb 26, 2020 at 2:07

Your Answer

Draft saved
Draft discarded

Sign up or log in

Sign up using Google
Sign up using Email and Password

Post as a guest

Required, but never shown

Post as a guest

Required, but never shown

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.