function readOnly(count){ }
Starting November 20, the site will be set to read-only. On December 4, 2023,
forum discussions will move to the Trailblazer Community.
+ Start a Discussion
Gautam_KasukhelaGautam_Kasukhela 

Problem with Lightning Web Components and Salesforce Data Badge

I am having trouble completing this badge. I keep getting an error that reads "We can’t find 'reduceErrors' imported into contactList.js."

I double checked the component, it is saved and has the the import statement. My workspace also has the ldsUtils component and even that is saved. This should have been a walk in the park challenge as a similar one is already stated in the trailhead module. Even with similar code as mentioned, I get an error: (https://trailhead.salesforce.com/content/learn/modules/lightning-web-components-and-salesforce-data/handle-server-errors)

//JS FILE
import {
    reduceErrors
} from 'c/ldsUtils';
import {
    LightningElement,
    wire
} from 'lwc';

import FIRST_NAME_FIELD from '@salesforce/schema/Contact.FirstName';
import LAST_NAME_FIELD from '@salesforce/schema/Contact.LastName';
import EMAIL_FIELD from '@salesforce/schema/Contact.Email';
import getContacts from '@salesforce/apex/ContactController.getContacts';

const COLUMNS = [{
        label: 'First Name',
        fieldName: FIRST_NAME_FIELD.fieldApiName,
        type: 'text'
    },
    {
        label: 'Last Name',
        fieldName: LAST_NAME_FIELD.fieldApiName,
        type: 'text'
    },
    {
        label: 'Email',
        fieldName: EMAIL_FIELD.fieldApiName,
        type: 'email'
    },
];

export default class ContactList extends LightningElement {

    columns = COLUMNS;
    errors;
    @wire(getContacts)
    contacts;


    get errors() {
        console.log('this.contacts.error: ', this.contacts.error);
        return (this.contacts.error) ? reduceErrors(this.contacts.error) : [];
    }
}

//HTML FILE
<template>
    <lightning-card title="Contact List">


        <template if:true={errors}>
            <p>{errors}</p>
        </template>

        <!--<lightning-datatable key-field="Id" data={contacts.data} columns={columns}>
        </lightning-datatable> -->
    </lightning-card>


</template>

//Controller

public with sharing class ContactController {
    
    @AuraEnabled(cacheable = true)
    public static List<Contact> getContacts(){
        
        //return [SELECT FirstName, LastName, Email FROM Contact];
        throw new AuraHandledException('Forced error');
    }
}
Best Answer chosen by Gautam_Kasukhela
Marcos LasoMarcos Laso
Sometimes little details such a semicolons (;) or line breaks doesnt allow you to pass some challenges. Try to put import statements in one line

All Answers

Gautam_KasukhelaGautam_Kasukhela
This is the error
AbhishekAbhishek (Salesforce Developers) 
Hi,

For all the Trailhead issues please report it here,

https://trailhead.salesforce.com/help?support=home#

https://trailhead.salesforce.com/help

So that our trailhead support engineers will look into it and get back to you.

I hope you find the above information is helpful. If it does, please mark as Best Answer to help others too.

Regards,
​​​​​​​Salesforce Support.
Marcos LasoMarcos Laso
Sometimes little details such a semicolons (;) or line breaks doesnt allow you to pass some challenges. Try to put import statements in one line
This was selected as the best answer
Gautam_KasukhelaGautam_Kasukhela
That did the trick Marcos. Put the import statement in one line and it worked. Strange though that Prettier extension puts the import statement on different lines and trailhead fails to recognise that. Will have that add-on disabled when working on trailhead modules. 
Ankit Rawat 41Ankit Rawat 41
Hi Guys. I just resolved this problem for Handle Server Errors In LWC and Salesforce Data Trailhead. Steps are as follows;
1. Goto this link first https://github.com/trailheadapps/lwc-recipes/tree/master/force-app/main/default/lwc/ldsUtils
2. Select lwc-recipes/force-app/main/default/lwc/ldsUtils/ and copy it.
3. In VS Code under force-app\main\default Lwc Folder right click and create New Folder and paste this what you copied in step 2.
4. After this right click on pasted folder and make new file and add both ldsUtils.js and ldsUtils.js-meta.xml with its data inside it. 
5. u can deploy sourse to org successfullyUser-added image
Ashutosh BhosaleAshutosh Bhosale
My contactList lightning web component is deployed succesfully on the org, yet it is not visible when i edit the 'work with data' page, what can be done to solve that?
 
Oleg Gorbach 13Oleg Gorbach 13


Ashutosh Bhosale, you should also check your  contactList.js-meta.xml file

It need to be something like this : 

 

<?xml version="1.0" encoding="UTF-8"?>
<LightningComponentBundle xmlns="http://soap.sforce.com/2006/04/metadata">
    <apiVersion>52.0</apiVersion>
    <isExposed>true</isExposed>
    <targets>
        <target>lightning__AppPage</target>
    </targets>
</LightningComponentBundle>