I'm following this trailhead step-by-step but I got an error which I don't know how to resolve.

I found this similar question but the suggested solution is already implemented on my code, please advise.


import { loadStyle } from 'lightning/platformResourceLoader'; --> This is where I get the error 'No MODULE named markup://c:bearTile found'
import { LightningElement, track, wire } from 'lwc';
import ursusResources from '@salesforce/resourceUrl/ursus_park';
/** BearController.searchBears(searchTerm) Apex method */
import searchBears from '@salesforce/apex/BearController.searchBears';
export default class BearList extends LightningElement {
    @track searchTerm = '';
    @wire(searchBears, {searchTerm: '$searchTerm'})
    connectedCallback() {
        loadStyle(this, ursusResources + '/style.css');
    handleSearchTermChange(event) {
        // Debouncing this method: do not update the reactive property as
        // long as this function is being called within a delay of 300 ms.
        // This is to avoid a very large number of Apex method calls.
        const searchTerm = event.target.value;
        // eslint-disable-next-line @lwc/lwc/no-async-operation 
        this.delayTimeout = setTimeout(() => {
            this.searchTerm = searchTerm;
        }, 300);
    get hasResults() {
        return (this.bears.data.length > 0);


    <lightning-card title="Bears" icon-name="utility:animal_and_nature">
        <div class="slds-card__body_inner">
            <!-- Start bear list -->
            <template if:true={bears.data}>
                <lightning-input type="search"
                    placeholder="Search for bears"
                <lightning-layout multiple-rows="true" pull-to-boundary="small">
                    <template for:each={bears.data} for:item="bear">
                        <lightning-layout-item key={bear.Id} size="3" class="slds-p-around_x-small">
                                <c-bear-tile bear={bear}></c-bear-tile>
                <!-- No bears found -->
                <template if:false={hasResults}>
                    <div class="slds-align_absolute-center slds-m-vertical_small">
                        This is beary disturbing, we did not find results...
            <!-- End bear list -->
            <!-- Data failed to load -->
            <template if:true={bears.error}>
                <div class="slds-text-color_error">
                    An error occurred while loading the bear list


        <lightning-card title={bear.Name} class="bear-tile">
            <div class="slds-p-horizontal_small">
                <div class="slds-media">
                    <div class="slds-media__figure">
                        <img src={appResources.bearSilhouette} alt="Bear profile" class="bear-silhouette"/>
                    <div class="slds-media__body">
                        <p class="slds-m-bottom_xx-small">{bear.Sex__c}</p>
                        <p class="slds-m-bottom_xx-small">{bear.Age__c} years old</p>
                        <p class="slds-m-bottom_xx-small">{bear.Height__c} cm</p>
                        <p class="slds-m-bottom_xx-small">{bear.Weight__c} Kg</p>


import { LightningElement, api } from 'lwc';
import ursusResources from '@salesforce/resourceUrl/ursus_park';
export default class BearTile extends LightningElement {
    @api bear;
    appResources = {
        bearSilhouette: ursusResources +'/img/standing-bear-silhouette.png',
  • Can you add your bearTile.js file too? Commented May 5, 2019 at 9:19
  • added as requested
    – Json
    Commented May 5, 2019 at 10:28
  • What do you think @sanketkumar?
    – Json
    Commented May 6, 2019 at 13:57

1 Answer 1


Found the solution - although the bearTile LWC was created in VSC it wasn't deployed yet, so all I had to do to resolve this is to deploy it and the error disappeared.


You must log in to answer this question.

Not the answer you're looking for? Browse other questions tagged .