Magento2 : require('Magento_Customer/js/customer-data') not loading always

Question

I am trying to get the cart items in phtml file (product detail page) using jquery script. Here is the script:

require([ 'jquery', 'jquery/ui'], function($,item){
item = require('Magento_Customer/js/customer-data').get('cart')().items; 
console.log(item.length);
});

It did not load customer data all the time. I need this to get the item count when a product is added or deleted from the mini cart dynamically using ajax cart. On firefox, its works but fails in chrome browser. I don't know how to initialize the requirement ('Magento_Customer/js/customer data) early so that it works well for all cases. Please help or provide other solutions to get the cart item dynamically using jquery

Answer 1

Try below code:

define(['jquery', 'jquery/ui', 'Magento_Customer/js/customer-data'], 
function($,item,customerData){
    var summaryCount = customerData.get('cart')().summary_count; 
    var item = customerData.get('cart')().items;
    console.log(summary_count);
    console.log(item.length);
});

Answer 2

you have to add a sequence into your module.xml

etc/module.xml

<?xml version="1.0"?>
<config>
    <module name="Module_Name">
        <sequence>
            <module name="Magento_Customer"/>
        </sequence>
    </module>
</config>